@vertigis/workflow 5.44.0 → 5.45.1

package/forms/FormHost.d.ts

@@ -113,7 +113,7 @@ export declare abstract class FormHost implements FormPresenterHost {
      */
     translateText(content: defs.Text | undefined): string | defs.MarkdownRef | undefined;
     /** Renders the form component. */
-    renderVisual(component: {}): any;
+    renderVisual(component: object): any;
     /** Qualifies an event with defaults. */
     protected qualifyDefault(event: defs.Event): string | undefined;
     /** Qualifies an event. */
@@ -227,7 +227,7 @@ export declare abstract class FormHost implements FormPresenterHost {
     /** Renders a component's state. */
     renderState(name: string, type: "item-picker", state?: defs.ItemPickerState): boolean;
     /** Renders a component's state. */
-    renderState(name: string, type: string, state?: {}): boolean;
+    renderState(name: string, type: string, state?: object): boolean;
     private getParentSection;
     private isSectionCollapsed;
     private isElementPositionBeforeLastFocused;

package/forms/FormPresenterHost.d.ts

@@ -39,11 +39,11 @@ export interface FormPresenterHost {
     /** Renders form text to display text. */
     renderText(text: defs.Text | undefined): string;
     /** Renders a component's visual. */
-    renderVisual(component: {}): any;
+    renderVisual(component: object): any;
     /** Renders a component's state. */
     renderState(name: string, type: "geometry", state?: defs.GeometryState[]): boolean;
     /** Renders a component's state. */
-    renderState(name: string, type: string, state?: {}): boolean;
+    renderState(name: string, type: string, state?: object): boolean;
     /** Find the element. */
     find(name: string | {
         name: string;

package/forms/components/AutoComplete.js

@@ -1 +1 @@
-import BaseAutoComplete,{autocompleteClasses,HighlightOption}from"@vertigis/react-ui/Autocomplete";import FormLabelTextField from"@vertigis/react-ui/FormLabelTextField";import Popper from"@vertigis/react-ui/Popper";import Skeleton from"@vertigis/react-ui/Skeleton";import{styled}from"@vertigis/react-ui/styles";import clsx from"clsx";import{useContext,useEffect,useMemo,useRef,useState}from"react";import*as React from"react";import{ExclusiveTimer}from"../ExclusiveTimer.js";import{autoCompletePropertyConstraints}from"../elements/AutoComplete.js";import HostContext from"../hostContext.js";import{getKeyString}from"../keyboard.js";import{getItemId,inspectItems,makeSafeClassName}from"../utils.js";import FormElement from"./FormElement.js";import{useFocusCallback}from"./common.js";const StyledAutoComplete=styled(BaseAutoComplete)(()=>({[`.${autocompleteClasses.endAdornment}`]:{right:1}})),popperClasses={skeletonOption:"skeleton-option"},StyledPopper=styled(Popper)(()=>({[`.${autocompleteClasses.listbox}`]:{[`.${autocompleteClasses.option}`]:{display:"block",[`&.${popperClasses.skeletonOption}`]:{'&[data-option-index="0"]':{span:{width:"70%"}},'&[data-option-index="1"]':{span:{width:"85%"}},'&[data-option-index="2"]':{span:{width:"55%"}}}}}})),StyledSkeleton=styled(Skeleton)(()=>({fontSize:"1.25rem",lineHeight:"inherit"})),pendingOption={enabled:!1,label:""},pendingOptions=[pendingOption,pendingOption,pendingOption],AutoComplete=({className:e,component:t,current:u,delay:r,element:o,enabled:n,error:l,items:p,label:m,minLength:s,name:a,prompt:i,tooltip:c,raiseEvent:d,setProperty:f,setValue:g,value:C})=>{const v=useContext(HostContext),[y,x]=useState(),[b,h]=useState(""),[S,O]=useState([]),[E,k]=useState(null),P=useRef(!1),T=useRef(),I=useRef(!1),R=useRef(v.renderText({status:"trivial"})),N=v.renderText(i),F=v.renderText(c),A=useFocusCallback(n,a,v),L=useRef({}),j=useRef({}),w=useMemo(()=>{let e=r;return"number"==typeof e&&!isNaN(e)||(e=autoCompletePropertyConstraints.delay.default),Math.max(e,autoCompletePropertyConstraints.delay.minimum)},[r]),H=useMemo(()=>{let e=s;return"number"==typeof e&&!isNaN(e)||(e=autoCompletePropertyConstraints.minLength.default),Math.max(e,autoCompletePropertyConstraints.minLength.minimum)},[s]),M=t.timer||(t.timer=new ExclusiveTimer),B=()=>{d("suggest",C,b,void 0,M.cancellationToken),O(pendingOptions)},K=()=>{f("items",{}),f("label",void 0)};useEffect(()=>{"clear"===y?K():"input"===y&&(m&&f("label",void 0),P.current=!0,b.length>=H?(f("current",void 0),M.reset(),M.start(w,B)):0<Object.keys(p||{}).length&&K())},[y,b]),useEffect(()=>{var e,t,r=E?.value;C!==r&&(t=(e=getItemId(E,L.current))?j.current[e]:void 0,f("current",e),f("label",t),g(r,{argument:t}))},[E]),useEffect(()=>{const{current:e,items:t,label:r,value:o}=inspectItems(u,p,C);f("current",e),f("label",r||m),f("value",o,!1);const n={};let l=null;const s=[];for(const i in t){var a=t[i];s.push(a);const r=v.renderText(a.label).trim();n[i]=r,e&&i===e&&(l=a)}j.current=n,L.current=t,O(s),k(l)},[p]),useEffect(()=>{var e="string"==typeof u?u:void 0,t=e?L.current[e]:void 0,e=e?j.current[e]:void 0;t?(f("label",e),f("value",t.value),h(e||"")):(f("value",void 0),P.current||h("")),k(t||null)},[u]),useEffect(()=>{P.current||I.current||h(""),P.current=!1,I.current=!1},[m]);const $=v.renderText(m);return React.createElement(FormElement,{className:e,element:o,inputId:T.current,name:a},t=>React.createElement(StyledAutoComplete,{autoSelect:!0,clearOnEscape:!0,clearOnBlur:!1,disabled:!n,filterOptions:e=>e,getOptionDisabled:e=>!1===e.enabled,getOptionKey:e=>getItemId(e,L.current)||"",getOptionLabel:e=>{e=getItemId(e,L.current);return e?j.current[e]:""},inputValue:b,noOptionsText:R.current,onBlur:()=>{1===S.length&&b.toLowerCase()===j.current[0]?.toLowerCase()?(h(j.current[0]),k(S[0])):f("label",b)},onChange:(e,t,r,o)=>{I.current=!0,k(t)},onInputChange:(e,t,r)=>{h(t),x(r)},onKeyDown:e=>{"enter"===getKeyString(e)&&e.stopPropagation()},options:S,PopperComponent:StyledPopper,renderOption:(e,t,{inputValue:r})=>{if(t===pendingOption){var o=clsx(e.className,popperClasses.skeletonOption);return React.createElement("li",{...e,className:o,key:e.id},React.createElement(StyledSkeleton,null))}o=getItemId(t,L.current),o={...e,className:clsx(e.className,t.styleName?makeSafeClassName(t.styleName):void 0),title:t.tooltip?v.renderText(t.tooltip):void 0,inputText:r,optionText:o?j.current[o]:""};return React.createElement(HighlightOption,{...o})},renderInput:e=>(e.inputProps={...e.inputProps,...t,value:e.inputProps.value||$,placeholder:N,title:F},T.current=e.id,React.createElement(FormLabelTextField,{error:!!l,...e,fullWidth:!0,inputRef:A})),value:E}))};export default AutoComplete;
+import BaseAutoComplete,{autocompleteClasses,HighlightOption}from"@vertigis/react-ui/Autocomplete";import FormLabelTextField from"@vertigis/react-ui/FormLabelTextField";import Popper from"@vertigis/react-ui/Popper";import Skeleton from"@vertigis/react-ui/Skeleton";import{styled}from"@vertigis/react-ui/styles";import clsx from"clsx";import{useContext,useEffect,useMemo,useRef,useState}from"react";import*as React from"react";import{ExclusiveTimer}from"../ExclusiveTimer.js";import{autoCompletePropertyConstraints}from"../elements/AutoComplete.js";import HostContext from"../hostContext.js";import{getKeyString}from"../keyboard.js";import{getItemId,inspectItems,makeSafeClassName}from"../utils.js";import FormElement from"./FormElement.js";import{useFocusCallback}from"./common.js";const StyledAutoComplete=styled(BaseAutoComplete)(()=>({[`.${autocompleteClasses.endAdornment}`]:{right:1}})),popperClasses={skeletonOption:"skeleton-option"},StyledPopper=styled(Popper)(()=>({[`.${autocompleteClasses.listbox}`]:{[`.${autocompleteClasses.option}`]:{display:"block",[`&.${popperClasses.skeletonOption}`]:{'&[data-option-index="0"]':{span:{width:"70%"}},'&[data-option-index="1"]':{span:{width:"85%"}},'&[data-option-index="2"]':{span:{width:"55%"}}}}}})),StyledSkeleton=styled(Skeleton)(()=>({fontSize:"1.25rem",lineHeight:"inherit"})),pendingOption={enabled:!1,label:""},pendingOptions=[pendingOption,pendingOption,pendingOption],AutoComplete=({className:e,component:t,current:u,delay:r,element:o,enabled:n,error:l,items:p,label:m,minLength:s,name:a,prompt:i,tooltip:c,raiseEvent:d,setProperty:f,setValue:g,value:C})=>{const v=useContext(HostContext),[y,x]=useState(),[b,h]=useState(""),[S,O]=useState([]),[E,k]=useState(null),P=useRef(!1),T=useRef(),I=useRef(!1),R=useRef(v.renderText({status:"trivial"})),N=v.renderText(i),F=v.renderText(c),A=useFocusCallback(n,a,v),L=useRef({}),j=useRef({}),w=useMemo(()=>{let e=r;return"number"==typeof e&&!isNaN(e)||(e=autoCompletePropertyConstraints.delay.default),Math.max(e,autoCompletePropertyConstraints.delay.minimum)},[r]),H=useMemo(()=>{let e=s;return"number"==typeof e&&!isNaN(e)||(e=autoCompletePropertyConstraints.minLength.default),Math.max(e,autoCompletePropertyConstraints.minLength.minimum)},[s]),M=t.timer||(t.timer=new ExclusiveTimer),B=()=>{d("suggest",C,b,void 0,M.cancellationToken),O(pendingOptions)},K=()=>{f("items",{}),f("label",void 0)};useEffect(()=>{"clear"===y?K():"input"===y&&(m&&f("label",void 0),P.current=!0,b.length>=H?(f("current",void 0),M.reset(),M.start(w,B)):0<Object.keys(p||{}).length&&K())},[y,b]),useEffect(()=>{var e,t,r=E?.value;C!==r&&(t=(e=getItemId(E,L.current))?j.current[e]:void 0,f("current",e),f("label",t),g(r,{argument:t}))},[E]),useEffect(()=>{const{current:e,items:t,label:r,value:o}=inspectItems(u,p,C);f("current",e),f("label",r||m),f("value",o,!1);const n={};let l=null;const s=[];for(const i in t){var a=t[i];s.push(a);const r=v.renderText(a.label).trim();n[i]=r,e&&i===e&&(l=a)}j.current=n,L.current=t,O(s),k(l)},[p]),useEffect(()=>{var e="string"==typeof u?u:void 0,t=e?L.current[e]:void 0,e=e?j.current[e]:void 0;t?(f("label",e),f("value",t.value),h(e||"")):(f("value",void 0),P.current||h("")),k(t||null)},[u]),useEffect(()=>{P.current||I.current||h(""),P.current=!1,I.current=!1},[m]);const $=v.renderText(m);return React.createElement(FormElement,{className:e,element:o,inputId:T.current,name:a},t=>React.createElement(StyledAutoComplete,{autoSelect:!0,clearOnEscape:!0,clearOnBlur:!1,disabled:!n,filterOptions:e=>e,getOptionDisabled:e=>!1===e.enabled,getOptionKey:e=>getItemId(e,L.current)||"",getOptionLabel:e=>{e=getItemId(e,L.current);return e?j.current[e]:""},inputValue:b,noOptionsText:R.current,onBlur:()=>{1===S.length&&b.toLowerCase()===j.current[0]?.toLowerCase()?(h(j.current[0]),k(S[0])):f("label",b)},onChange:(e,t)=>{I.current=!0,k(t)},onInputChange:(e,t,r)=>{h(t),x(r)},onKeyDown:e=>{"enter"===getKeyString(e)&&e.stopPropagation()},options:S,renderOption:(e,t,{inputValue:r})=>{if(t===pendingOption){var o=clsx(e.className,popperClasses.skeletonOption);return React.createElement("li",{...e,className:o,key:e.id},React.createElement(StyledSkeleton,null))}o=getItemId(t,L.current),o={...e,className:clsx(e.className,t.styleName?makeSafeClassName(t.styleName):void 0),title:t.tooltip?v.renderText(t.tooltip):void 0,inputText:r,optionText:o?j.current[o]:""};return React.createElement(HighlightOption,{...o})},renderInput:e=>(e.inputProps={...e.inputProps,...t,value:e.inputProps.value||$,placeholder:N,title:F},T.current=e.id,React.createElement(FormLabelTextField,{error:!!l,...e,fullWidth:!0,inputRef:A})),slotProps:{popper:{component:StyledPopper}},value:E}))};export default AutoComplete;

package/forms/components/ButtonBar.js

@@ -1 +1 @@
-import Button from"@vertigis/react-ui/Button";import Stack,{stackClasses}from"@vertigis/react-ui/Stack";import{styled}from"@vertigis/react-ui/styles";import*as React from"react";import{useContext}from"react";import{Orientation}from"../constants.js";import HostContext from"../hostContext.js";import{makeSafeClassName,sortAndFilter}from"../utils.js";import FormElement from"./FormElement.js";import Markdown from"./Markdown.js";import{useFocusCallback}from"./common.js";const StyledFormElement=styled(FormElement)(({theme:{spacing:e}})=>({[`.${stackClasses.root}`]:{alignItems:"flex-start",flexWrap:"wrap",marginTop:e(1),marginBottom:e(1)}})),ButtonBar=({className:e,element:t,enabled:l,items:o,name:a,orientation:r,raiseEvent:c})=>{const d=useContext(HostContext),u=sortAndFilter(o),f=useFocusCallback(l,a,d);o=l?Object.entries(u).filter(e=>!1!==e[1].enabled&&!1!==e[1].visible)[0]:void 0;const p=o?o[0]:void 0;return React.createElement(StyledFormElement,{className:e,component:"fieldset",element:t,name:a},React.createElement(Stack,{direction:r===Orientation.VERTICAL?"column":"row",spacing:1},Object.keys(u).map(e=>{var t,o,a=u[e],r=a.styleName?makeSafeClassName(a.styleName):void 0,n=!1!==a.visible,i=l&&!1!==a.enabled&&n,s=d.renderText(a.tooltip),m=u[e]["value"];return n?React.createElement(Button,{className:r,color:a.default?"primary":"inherit",disabled:!i,key:e,onClick:(t=e,o=m,function(e){c("clicked",o,void 0,t)}),ref:p&&e===p?f:void 0,title:s,variant:a.default?"contained":"outlined"},React.createElement(Markdown,{inline:!0,text:a.label||""})):null})))};export default ButtonBar;
+import Button from"@vertigis/react-ui/Button";import Stack,{stackClasses}from"@vertigis/react-ui/Stack";import{styled}from"@vertigis/react-ui/styles";import*as React from"react";import{useContext}from"react";import{Orientation}from"../constants.js";import HostContext from"../hostContext.js";import{makeSafeClassName,sortAndFilter}from"../utils.js";import FormElement from"./FormElement.js";import Markdown from"./Markdown.js";import{useFocusCallback}from"./common.js";const StyledFormElement=styled(FormElement)(({theme:{spacing:e}})=>({[`.${stackClasses.root}`]:{alignItems:"flex-start",flexWrap:"wrap",marginTop:e(1),marginBottom:e(1)}})),ButtonBar=({className:e,element:t,enabled:l,items:o,name:a,orientation:r,raiseEvent:c})=>{const d=useContext(HostContext),u=sortAndFilter(o),f=useFocusCallback(l,a,d);o=l?Object.entries(u).filter(e=>!1!==e[1].enabled&&!1!==e[1].visible)[0]:void 0;const p=o?o[0]:void 0;return React.createElement(StyledFormElement,{className:e,component:"fieldset",element:t,name:a},React.createElement(Stack,{direction:r===Orientation.VERTICAL?"column":"row",spacing:1},Object.keys(u).map(e=>{var t,o,a=u[e],r=a.styleName?makeSafeClassName(a.styleName):void 0,n=!1!==a.visible,i=l&&!1!==a.enabled&&n,s=d.renderText(a.tooltip),m=u[e]["value"];return n?React.createElement(Button,{className:r,color:a.default?"primary":"inherit",disabled:!i,key:e,onClick:(t=e,o=m,function(){c("clicked",o,void 0,t)}),ref:p&&e===p?f:void 0,title:s,variant:a.default?"contained":"outlined"},React.createElement(Markdown,{inline:!0,text:a.label||""})):null})))};export default ButtonBar;

package/forms/components/CheckBox.js

@@ -1 +1 @@
-import Checkbox from"@vertigis/react-ui/Checkbox";import FormControlLabel from"@vertigis/react-ui/FormControlLabel";import*as React from"react";import{useContext}from"react";import HostContext from"../hostContext.js";import FormElement from"./FormElement.js";import Markdown from"./Markdown.js";import{useFocusCallback}from"./common.js";const CheckBox=({checked:t,className:e,element:o,enabled:r,label:a,name:c,raiseEvent:m,setProperty:n,tooltip:l,value:s})=>{const i=useContext(HostContext),C=i.renderText(l),d=useFocusCallback(r,c,i),k=e=>{e=e.target.checked;n("checked",e),m("changed",e?s:void 0,e)};return React.createElement(FormElement,{className:e,element:o,name:c},e=>React.createElement(FormControlLabel,{control:React.createElement(Checkbox,{checked:t,inputProps:e,inputRef:d,onChange:k}),disabled:!r,label:React.createElement(Markdown,{text:a}),title:C}))};export default CheckBox;
+import Checkbox from"@vertigis/react-ui/Checkbox";import FormControlLabel from"@vertigis/react-ui/FormControlLabel";import*as React from"react";import{useContext}from"react";import HostContext from"../hostContext.js";import FormElement from"./FormElement.js";import Markdown from"./Markdown.js";import{useFocusCallback}from"./common.js";const CheckBox=({checked:t,className:e,element:o,enabled:r,label:a,name:c,raiseEvent:m,setProperty:n,tooltip:l,value:s})=>{const i=useContext(HostContext),C=i.renderText(l),d=useFocusCallback(r,c,i),k=e=>{e=e.target.checked;n("checked",e),m("changed",e?s:void 0,e)};return React.createElement(FormElement,{className:e,element:o,name:c},e=>React.createElement(FormControlLabel,{control:React.createElement(Checkbox,{checked:t,onChange:k,slotProps:{input:{...e,ref:d}}}),disabled:!r,label:React.createElement(Markdown,{text:a}),title:C}))};export default CheckBox;

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

package/forms/components/DateRangePicker.js

@@ -1 +1 @@
-import BaseDateRangePicker from"@vertigis/react-ui/DateRangePicker";import FormHelperText from"@vertigis/react-ui/FormHelperText";import{styled}from"@vertigis/react-ui/styles";import clsx from"clsx";import{useContext,useEffect,useMemo,useRef,useState}from"react";import*as React from"react";import{areValuesEqual,convertToDateRangeRef,getDateBounds}from"../dateUtilities.js";import HostContext from"../hostContext.js";import{isInvalidError}from"../textUtilities.js";import{makeUniqueId}from"../utils.js";import DateTimeTextField from"./DateTimeTextField.js";import FormElement from"./FormElement.js";import{useFocusCallback}from"./common.js";const DateRangePickerField=e=>{const{inputProps:t,...r}=e,{"data-elementError":a,...o}=t;return r.error=r.error||a,React.createElement(DateTimeTextField,{inputProps:o,...r})},PREFIX="DateRangePicker",dateRangePickerClasses={root:`${PREFIX}-root`,toLabel:`${PREFIX}-toLabel`},StyledFormElement=styled(FormElement)(({theme:{spacing:e}})=>({[`.${dateRangePickerClasses.toLabel}`]:{paddingTop:e(3)}})),DateRangePicker=({className:e,element:t,enabled:r,error:a,format:o,name:s,setProperty:n,setValue:i,tooltip:l,value:m})=>{const u=useContext(HostContext),[c,d]=useState([null,null]),[p,f]=useState(-1),[R,g]=useState([!1,!1]),[x,E]=useState(!1),[D,F]=useState([null,null]),P=useRef(),k=useRef(!0),v=isInvalidError(a);useEffect(()=>{var e=convertToDateRangeRef(m),t=[e?.startDate||null,e?.endDate||null],e=b(t);areValuesEqual(m,e)||i(e,!1),F(t)},[m]),useEffect(()=>{var e=0===p?R[0]:!!c[0],t=1===p?R[1]:!!c[1];g([e,t]);t=e||t;if(t?v||n("error",{status:"invalid"}):v&&n("error",void 0),!x&&-1===p&&!t){if(k.current)return void(k.current=!1);t=b(D);areValuesEqual(m,t)||i(t)}k.current=!1},[c,p,x]);const T=u.renderText(l),C=useFocusCallback(r,s,u),b=e=>{if(e[0]&&e[1])return{refValueType:"daterange",startDate:e[0],endDate:e[1]}},I=useMemo(()=>`${makeUniqueId(s)}-input`,[s]);var S=R[0]||R[1],{min:l,max:o}=getDateBounds(o);return React.createElement(StyledFormElement,{className:clsx(e,dateRangePickerClasses.root),element:t,inputId:I,name:s},S&&React.createElement(FormHelperText,{component:"div",error:!0,role:"alert"},P.current),React.createElement(BaseDateRangePicker,{disabled:!r,maxDate:o,minDate:l,onChange:e=>F(e),onClose:()=>E(!1),onError:e=>d(e),onOpen:()=>E(!0),slots:{textField:DateRangePickerField},slotProps:{fieldSeparator:{children:u.renderText("@common-to"),className:dateRangePickerClasses.toLabel},textField:({position:e})=>({inputProps:{id:"start"===e?I:void 0,"data-elementError":!!a,"data-index":"start"===e?0:1},inputRef:e=>{"0"===e?.dataset.index&&(P.current=e.dataset.formatString,C(e))},onBlur:e=>{Number.parseInt(e.target.dataset.index)===p&&f(-1)},onFocus:e=>{e=Number.parseInt(e.target.dataset.index);f(e)},title:T})},value:D}))};export default DateRangePicker;export{dateRangePickerClasses};
+import BaseDateRangePicker from"@vertigis/react-ui/DateRangePicker";import FormHelperText from"@vertigis/react-ui/FormHelperText";import{styled}from"@vertigis/react-ui/styles";import clsx from"clsx";import{useContext,useEffect,useMemo,useRef,useState}from"react";import*as React from"react";import{areValuesEqual,convertToDateRangeRef,getDateBounds}from"../dateUtilities.js";import HostContext from"../hostContext.js";import{isInvalidError}from"../textUtilities.js";import{makeUniqueId}from"../utils.js";import DateTimeTextField from"./DateTimeTextField.js";import FormElement from"./FormElement.js";import{useFocusCallback}from"./common.js";const DateRangePickerField=e=>{const{FormHelperTextProps:t,InputProps:r,InputLabelProps:a,inputProps:o,SelectProps:s,...n}=e,l=n.slotProps??{};return delete n.slotProps,l.formHelperText={...t,...l.formHelperText},l.input={...r,...l.input},l.inputLabel={...a,...l.inputLabel},l.htmlInput={...o,...l.htmlInput},l.select={...s,...l.select},n.error=n.error||l.htmlInput["data-elementError"],delete l.htmlInput["data-elementError"],React.createElement(DateTimeTextField,{...n,slotProps:l})},PREFIX="DateRangePicker",dateRangePickerClasses={root:`${PREFIX}-root`,toLabel:`${PREFIX}-toLabel`},StyledDateRangePicker=styled(BaseDateRangePicker)({alignItems:"center"}),StyledFormElement=styled(FormElement)(({theme:{spacing:e}})=>({[`.${dateRangePickerClasses.toLabel}`]:{paddingTop:e(3)}})),DateRangePicker=({className:e,element:t,enabled:r,error:a,format:o,name:s,setProperty:n,setValue:l,tooltip:i,value:m})=>{const u=useContext(HostContext),[c,d]=useState([null,null]),[p,f]=useState(-1),[R,g]=useState([!1,!1]),[x,P]=useState(!1),[E,D]=useState([null,null]),F=useRef(),k=useRef(!0),I=isInvalidError(a);useEffect(()=>{var e=convertToDateRangeRef(m),t=[e?.startDate||null,e?.endDate||null],e=C(t);areValuesEqual(m,e)||l(e,!1),D(t)},[m]),useEffect(()=>{var e=0===p?R[0]:!!c[0],t=1===p?R[1]:!!c[1];g([e,t]);t=e||t;if(t?I||n("error",{status:"invalid"}):I&&n("error",void 0),!x&&-1===p&&!t){if(k.current)return void(k.current=!1);t=C(E);areValuesEqual(m,t)||l(t)}k.current=!1},[c,p,x]);const T=u.renderText(i),v=useFocusCallback(r,s,u),C=e=>{if(e[0]&&e[1])return{refValueType:"daterange",startDate:e[0],endDate:e[1]}},b=useMemo(()=>`${makeUniqueId(s)}-input`,[s]);var S=R[0]||R[1],{min:i,max:o}=getDateBounds(o);return React.createElement(StyledFormElement,{className:clsx(e,dateRangePickerClasses.root),element:t,inputId:b,name:s},S&&React.createElement(FormHelperText,{component:"div",error:!0,role:"alert"},F.current),React.createElement(StyledDateRangePicker,{disabled:!r,maxDate:o,minDate:i,onChange:e=>D(e),onClose:()=>P(!1),onError:e=>d(e),onOpen:()=>P(!0),slots:{textField:DateRangePickerField},slotProps:{fieldSeparator:{children:u.renderText("@common-to"),className:dateRangePickerClasses.toLabel},textField:({position:e})=>({inputRef:e=>{"0"===e?.dataset.index&&(F.current=e.dataset.formatString,v(e))},onBlur:e=>{Number.parseInt(e.target.dataset.index)===p&&f(-1)},onFocus:e=>{e=Number.parseInt(e.target.dataset.index);f(e)},slotProps:{htmlInput:{id:"start"===e?b:void 0,"data-elementError":!!a,"data-index":"start"===e?0:1}},title:T})},value:E}))};export default DateRangePicker;export{dateRangePickerClasses};

package/forms/components/DateTimePicker.js

@@ -1 +1 @@
-import{buttonBaseClasses}from"@vertigis/react-ui/ButtonBase";import BaseDateTimePicker from"@vertigis/react-ui/DateTimePicker";import FormHelperText from"@vertigis/react-ui/FormHelperText";import{clockClasses}from"@vertigis/react-ui/TimeClock";import{styled}from"@vertigis/react-ui/styles";import*as React from"react";import{useContext,useEffect,useMemo,useRef,useState}from"react";import{Calendar}from"../Calendar.js";import{areValuesEqual,getDateBounds,getNewElementValue,makeProperValue}from"../dateUtilities.js";import HostContext from"../hostContext.js";import{isInvalidError}from"../textUtilities.js";import{makeUniqueId,useLocale}from"../utils.js";import DateTimeTextField from"./DateTimeTextField.js";import FormElement from"./FormElement.js";import{useFocusCallback}from"./common.js";const StylableDateTimePicker=e=>{let{className:t,slotProps:r,...a}=e;return r=r||{},React.createElement(BaseDateTimePicker,{slotProps:{...r,actionBar:{sx:{display:"none"}},popper:{...r.popper,className:t}},...a})},StyledDateTimePicker=styled(StylableDateTimePicker)(({theme:{palette:e}})=>({[`& .${clockClasses.amButton}, .${clockClasses.pmButton}`]:{[`&.${buttonBaseClasses.focusVisible}`]:{color:e.action.active}}})),DateTimePicker=({className:e,element:t,enabled:r,error:a,format:o,name:s,prompt:i,setProperty:l,setValue:m,tooltip:n,value:u})=>{const c=useContext(HostContext),[p,d]=useState(!1),[f,T]=useState(!1),[k,x]=useState(!1),[E,v]=useState(null),C=useRef();const D={locale:useLocale(),timezone:(new Intl.DateTimeFormat).resolvedOptions().timeZone},F=useRef(!0),P=useFocusCallback(r,s,c),g=c.renderText(n),B=Calendar.useNative(),R="datetime",y=isInvalidError(a);useEffect(()=>{var e=makeProperValue(u,B),t=getNewElementValue(e,R,D,B);areValuesEqual(u,t)||m(t,!1),v(e||null)},[u]),useEffect(()=>{if(!k&&!f)if(p)y||l("error",{status:"invalid"});else{if(y&&l("error",void 0),F.current)return void(F.current=!1);var e=getNewElementValue(E,R,D,B);areValuesEqual(u,e)||m(e)}F.current=!1},[p,f,k]);const{min:S,max:V}=getDateBounds(o),b=useMemo(()=>`${makeUniqueId(s)}-input`,[s]),j=c.renderText(i);return React.createElement(FormElement,{className:e,element:t,inputId:b,name:s},e=>React.createElement(React.Fragment,null,y&&React.createElement(FormHelperText,{component:"div",error:!0,role:"alert"},C.current),React.createElement(StyledDateTimePicker,{disabled:!r,key:"date-picker",inputRef:e=>{e&&(C.current=e.dataset.formatString,P(e))},maxDateTime:V,minDateTime:S,onChange:e=>v(e),onClose:()=>x(!1),onError:e=>d(!!e),onOpen:()=>x(!0),slots:{textField:DateTimeTextField},slotProps:{textField:{error:!!a,id:b,inputProps:{...e,placeholder:j},onBlur:()=>T(!1),onFocus:()=>T(!0),title:g}},value:E})))};export default DateTimePicker;
+import{buttonBaseClasses}from"@vertigis/react-ui/ButtonBase";import BaseDateTimePicker from"@vertigis/react-ui/DateTimePicker";import FormHelperText from"@vertigis/react-ui/FormHelperText";import{clockClasses}from"@vertigis/react-ui/TimeClock";import{styled}from"@vertigis/react-ui/styles";import*as React from"react";import{useContext,useEffect,useMemo,useRef,useState}from"react";import{Calendar}from"../Calendar.js";import{areValuesEqual,getDateBounds,getNewElementValue,makeProperValue}from"../dateUtilities.js";import HostContext from"../hostContext.js";import{isInvalidError}from"../textUtilities.js";import{makeUniqueId,useLocale}from"../utils.js";import DateTimeTextField from"./DateTimeTextField.js";import FormElement from"./FormElement.js";import{useFocusCallback}from"./common.js";const StylableDateTimePicker=e=>{const{className:t,slotProps:r,...a}=e;return React.createElement(BaseDateTimePicker,{slotProps:{...r,actionBar:{sx:{display:"none"}},popper:{...r?.popper,className:t}},...a})},StyledDateTimePicker=styled(StylableDateTimePicker)(({theme:{palette:e}})=>({[`& .${clockClasses.amButton}, .${clockClasses.pmButton}`]:{[`&.${buttonBaseClasses.focusVisible}`]:{color:e.action.active}}})),DateTimePicker=({className:e,element:t,enabled:r,error:a,format:o,name:s,prompt:i,setProperty:l,setValue:m,tooltip:n,value:u})=>{const c=useContext(HostContext),[p,d]=useState(!1),[f,T]=useState(!1),[k,x]=useState(!1),[E,v]=useState(null),C=useRef();const D={locale:useLocale(),timezone:(new Intl.DateTimeFormat).resolvedOptions().timeZone},F=useRef(!0),P=useFocusCallback(r,s,c),g=c.renderText(n),B=Calendar.useNative(),R="datetime",y=isInvalidError(a);useEffect(()=>{var e=makeProperValue(u,B),t=getNewElementValue(e,R,D,B);areValuesEqual(u,t)||m(t,!1),v(e||null)},[u]),useEffect(()=>{if(!k&&!f)if(p)y||l("error",{status:"invalid"});else{if(y&&l("error",void 0),F.current)return void(F.current=!1);var e=getNewElementValue(E,R,D,B);areValuesEqual(u,e)||m(e)}F.current=!1},[p,f,k]);const{min:S,max:V}=getDateBounds(o),b=useMemo(()=>`${makeUniqueId(s)}-input`,[s]),j=c.renderText(i);return React.createElement(FormElement,{className:e,element:t,inputId:b,name:s},e=>React.createElement(React.Fragment,null,y&&React.createElement(FormHelperText,{component:"div",error:!0,role:"alert"},C.current),React.createElement(StyledDateTimePicker,{disabled:!r,key:"date-picker",inputRef:e=>{e&&(C.current=e.dataset.formatString,P(e))},maxDateTime:V,minDateTime:S,onChange:e=>v(e),onClose:()=>x(!1),onError:e=>d(!!e),onOpen:()=>x(!0),slots:{textField:DateTimeTextField},slotProps:{textField:{error:!!a,id:b,inputProps:{...e,placeholder:j},onBlur:()=>T(!1),onFocus:()=>T(!0),title:g}},value:E})))};export default DateTimePicker;

package/forms/components/DateTimeTextField.js

@@ -1 +1 @@
-import FormLabelTextField from"@vertigis/react-ui/FormLabelTextField";import*as React from"react";const DateTimeTextField=e=>{const{inputProps:t,placeholder:r,...a}=e,{placeholder:l,...o}=t;return React.createElement(FormLabelTextField,{...a,inputProps:{...o,placeholder:l||r,"data-format-string":r}})};export default DateTimeTextField;
+import FormLabelTextField from"@vertigis/react-ui/FormLabelTextField";import*as React from"react";const DateTimeTextField=t=>{const{placeholder:e,inputProps:r,InputProps:l,...o}=t,a=o.slotProps??{};var{htmlInput:p,input:t}=a;return a.htmlInput={...r,...p,"data-format-string":e},a.htmlInput.placeholder||(a.htmlInput.placeholder=e),a.input={...l,...t},delete o.slotProps,React.createElement(FormLabelTextField,{...o,slotProps:a})};export default DateTimeTextField;

package/forms/components/FormElement.js

@@ -1 +1 @@
-import FormControl from"@vertigis/react-ui/FormControl";import{styled}from"@vertigis/react-ui/styles";import clsx from"clsx";import{forwardRef,useContext}from"react";import*as React from"react";import{TitleLocation}from"../constants.js";import HostContext from"../hostContext.js";import{makeSafeClassName,makeUniqueId}from"../utils.js";import{formClasses}from"./Form.js";import{renderAccessibleDescription,renderDescription,renderError,renderTitle}from"./common.js";const StyledFormControl=styled(FormControl)(({theme:{palette:e,spacing:r}})=>({code:{backgroundColor:"rgba(0, 0, 0, .06)",fontFamily:'"Consolas", monospace'},table:{borderCollapse:"collapse","td, th":{border:`1px solid ${e.grey[400]}`,padding:r(.5)},th:{backgroundColor:e.grey[100]}}}));export default forwardRef((e,r)=>{var{children:o,className:t,component:s,element:i,inputId:a,name:n}=e,l=useContext(HostContext),m=makeUniqueId(n),c=renderTitle(m,i.require,i.title,a,"fieldset"===s?"legend":void 0),e=renderDescription(i.description,m,i.enabled),a=renderAccessibleDescription(i.accessibleDescription,i.description,m,l),l=renderError(i.error);const d={className:clsx(t,i.type,{[formClasses.formElementWithTitleBeside]:i.titleLocation===TitleLocation.BESIDE,[makeSafeClassName(n)]:!!n,[makeSafeClassName(i.styleName)]:!!i.styleName}),component:s,error:!!l,id:m,ref:r,required:i.require};m=c?.props?.id,r=a?.props?.id;const p=o instanceof Function?o:void 0;let f=o instanceof Function?void 0:o;p?f=p({"aria-labelledby":m,"aria-describedby":r}):(d["aria-labelledby"]=m,d["aria-describedby"]=r);let u=[c];return i.titleLocation===TitleLocation.BESIDE?u.push(React.createElement("div",{className:formClasses.formElementContent},e,a,l,f)):(u.push(e),u.push(a),u.push(l),u.push(f)),React.createElement(StyledFormControl,{fullWidth:!0,...d},...u)});
+import FormControl from"@vertigis/react-ui/FormControl";import{styled}from"@vertigis/react-ui/styles";import clsx from"clsx";import{forwardRef,useContext}from"react";import*as React from"react";import{TitleLocation}from"../constants.js";import HostContext from"../hostContext.js";import{makeSafeClassName,makeUniqueId}from"../utils.js";import{formClasses}from"./Form.js";import{renderAccessibleDescription,renderDescription,renderError,renderTitle}from"./common.js";const StyledFormControl=styled(FormControl)(({theme:{palette:e,spacing:r}})=>({code:{backgroundColor:"rgba(0, 0, 0, .06)",fontFamily:'"Consolas", monospace'},table:{borderCollapse:"collapse","td, th":{border:`1px solid ${e.grey[400]}`,padding:r(.5)},th:{backgroundColor:e.grey[100]}}}));export default forwardRef((e,r)=>{var{children:o,className:t,component:s,element:i,inputId:a,name:n}=e,l=useContext(HostContext),m=makeUniqueId(n),c=renderTitle(m,i.require,i.title,a,"fieldset"===s?"legend":void 0),e=renderDescription(i.description,m,i.enabled),a=renderAccessibleDescription(i.accessibleDescription,i.description,m,l),l=renderError(i.error);const d={className:clsx(t,i.type,{[formClasses.formElementWithTitleBeside]:i.titleLocation===TitleLocation.BESIDE,[makeSafeClassName(n)]:!!n,[makeSafeClassName(i.styleName)]:!!i.styleName}),component:s,error:!!l,id:m,ref:r,required:i.require};m=c?.props?.id,r=a?.props?.id;const p=o instanceof Function?o:void 0;let f=o instanceof Function?void 0:o;p?f=p({"aria-labelledby":m,"aria-describedby":r}):(d["aria-labelledby"]=m,d["aria-describedby"]=r);const u=[c];return i.titleLocation===TitleLocation.BESIDE?u.push(React.createElement("div",{className:formClasses.formElementContent},e,a,l,f)):(u.push(e),u.push(a),u.push(l),u.push(f)),React.createElement(StyledFormControl,{fullWidth:!0,...d},...u)});

package/forms/components/GeometryPicker.js

@@ -1 +1 @@
-import Box from"@vertigis/react-ui/Box";import Button from"@vertigis/react-ui/Button";import IconButton from"@vertigis/react-ui/IconButton";import List from"@vertigis/react-ui/List";import ListItemButton from"@vertigis/react-ui/ListItemButton";import Plus from"@vertigis/react-ui/icons/Plus";import Trash from"@vertigis/react-ui/icons/Trash";import*as React from"react";import{useContext,useEffect,useRef,useState}from"react";import HostContext from"../hostContext.js";import{sanitizeGeometryRef,text}from"../utils.js";import FormElement from"./FormElement.js";import GeometryPickerListItem from"./GeometryPickerListItem.js";import Markdown from"./Markdown.js";import{useFocusCallback}from"./common.js";const GeometryPicker=({autoActivate:e,className:t,element:r,enabled:o,itemLabel:i,name:n,prompt:s,raiseEvent:a,setProperty:c,setValue:l,size:m,state:u,tooltip:d,value:f})=>{const p=useContext(HostContext),[g,v]=useState([]),[h,k]=useState(""),y=u,x=useRef(!1);let E=5;"number"==typeof m&&(E=1<m?Math.ceil(m):1),useEffect(()=>{var e=sanitizeGeometryRef(f);f!==e&&l(e,!1),void 0!==f&&(Array.isArray(i)?v(i):(v([]),text.isMarkdown(i)?i.markdown&&k(i):text.isStatus(i)?i.status&&k(i.status):i&&k(i))),void 0!==y&&null!==y||c("state",[])},[f]);const[R,b]=useState([]),B=useFocusCallback(o,n,p);const I=e=>{let t=y[e];return void 0!==t&&null!==t||(y.length<=e&&(y.length=e,y.push({})),t=y[e]),t},C=n=>()=>{let e;if(1<f.geometry.length){const r=[...f.geometry];if(r.splice(n,1),e={...f,geometry:r},y.splice(n,1),n<g.length){const o=[...g];o.splice(n,1),v(o)}}else y.length=0;let t=[];for(const i of R)i<n?t.push(i):i>n&&t.push(i-1);b(t),l(e,{argument:"remove"})};var L=e=>{o&&C(e)()},P=(e,t,r)=>{const o=I(e);o.focused=t,o.pending=r,p.renderState(n,"geometry",y)};let G=o;const S=[];if(void 0!==f&&void 0!==y){G=o&&f.geometry.length<E;var j=p.renderText("@geometry-picker-remove-item-label");for(const A of f.geometry){var w=S.length;I(w).content=A;var M=`checkbox-list-label-${w}`;S.push(React.createElement(GeometryPickerListItem,{deleteItem:L,disablePadding:!0,itemIndex:w,key:"$"+w,secondaryAction:React.createElement(IconButton,{"aria-label":j,className:"delete",disabled:!o,edge:"end",onClick:C(w),ref:B,title:j},React.createElement(Trash,null)),updateHighlight:P},React.createElement(ListItemButton,{onClick:(o=>()=>{var e=R.indexOf(o);const t=[...R],r=I(o);-1===e?(r.checked=!0,t.push(o)):(r.checked=!1,t.splice(e,1)),b(t)})(w),ref:(t=>e=>{B(e),null!==e&&(e.checked=!!I(t).checked)})(w),selected:-1!==R.indexOf(w)},React.createElement(Markdown,{id:M,inline:!0,text:g[w]||h}))))}}const T=()=>{a("clicked",f)};d=p.renderText(d);return o&&e&&!x.current&&(setTimeout(()=>{c("autoActivate",void 0),x.current=!1,G&&T()}),x.current=!0),React.createElement(FormElement,{className:t,component:"fieldset",element:r,name:n,ref:e=>{let t=y;null===e&&(r.visible||c("state",[]),t=void 0),p.renderState(n,"geometry",t)}},React.createElement(List,null,S),React.createElement(Box,null,React.createElement(Button,{disabled:!G,onClick:T,ref:B,startIcon:React.createElement(Plus,null),title:d,variant:"outlined"},React.createElement(Markdown,{inline:!0,text:s||""}))))};export default GeometryPicker;
+import Box from"@vertigis/react-ui/Box";import Button from"@vertigis/react-ui/Button";import IconButton from"@vertigis/react-ui/IconButton";import List from"@vertigis/react-ui/List";import ListItemButton from"@vertigis/react-ui/ListItemButton";import Plus from"@vertigis/react-ui/icons/Plus";import Trash from"@vertigis/react-ui/icons/Trash";import*as React from"react";import{useContext,useEffect,useRef,useState}from"react";import HostContext from"../hostContext.js";import{sanitizeGeometryRef,text}from"../utils.js";import FormElement from"./FormElement.js";import GeometryPickerListItem from"./GeometryPickerListItem.js";import Markdown from"./Markdown.js";import{useFocusCallback}from"./common.js";const GeometryPicker=({autoActivate:e,className:t,element:r,enabled:o,itemLabel:i,name:n,prompt:s,raiseEvent:a,setProperty:c,setValue:l,size:m,state:u,tooltip:d,value:f})=>{const p=useContext(HostContext),[g,v]=useState([]),[h,k]=useState(""),y=u,x=useRef(!1);let E=5;"number"==typeof m&&(E=1<m?Math.ceil(m):1),useEffect(()=>{var e=sanitizeGeometryRef(f);f!==e&&l(e,!1),void 0!==f&&(Array.isArray(i)?v(i):(v([]),text.isMarkdown(i)?i.markdown&&k(i):text.isStatus(i)?i.status&&k(i.status):i&&k(i))),void 0!==y&&null!==y||c("state",[])},[f]);const[R,b]=useState([]),B=useFocusCallback(o,n,p);const I=e=>{let t=y[e];return void 0!==t&&null!==t||(y.length<=e&&(y.length=e,y.push({})),t=y[e]),t},C=n=>()=>{let e;if(1<f.geometry.length){const r=[...f.geometry];if(r.splice(n,1),e={...f,geometry:r},y.splice(n,1),n<g.length){const o=[...g];o.splice(n,1),v(o)}}else y.length=0;const t=[];for(const i of R)i<n?t.push(i):i>n&&t.push(i-1);b(t),l(e,{argument:"remove"})};var L=e=>{o&&C(e)()},P=(e,t,r)=>{const o=I(e);o.focused=t,o.pending=r,p.renderState(n,"geometry",y)};let G=o;const S=[];if(void 0!==f&&void 0!==y){G=o&&f.geometry.length<E;var j=p.renderText("@geometry-picker-remove-item-label");for(const A of f.geometry){var w=S.length;I(w).content=A;var M=`checkbox-list-label-${w}`;S.push(React.createElement(GeometryPickerListItem,{deleteItem:L,disablePadding:!0,itemIndex:w,key:"$"+w,secondaryAction:React.createElement(IconButton,{"aria-label":j,className:"delete",disabled:!o,edge:"end",onClick:C(w),ref:B,title:j},React.createElement(Trash,null)),updateHighlight:P},React.createElement(ListItemButton,{onClick:(o=>()=>{var e=R.indexOf(o);const t=[...R],r=I(o);-1===e?(r.checked=!0,t.push(o)):(r.checked=!1,t.splice(e,1)),b(t)})(w),ref:(t=>e=>{B(e),null!==e&&(e.checked=!!I(t).checked)})(w),selected:-1!==R.indexOf(w)},React.createElement(Markdown,{id:M,inline:!0,text:g[w]||h}))))}}const T=()=>{a("clicked",f)};d=p.renderText(d);return o&&e&&!x.current&&(setTimeout(()=>{c("autoActivate",void 0),x.current=!1,G&&T()}),x.current=!0),React.createElement(FormElement,{className:t,component:"fieldset",element:r,name:n,ref:e=>{let t=y;null===e&&(r.visible||c("state",[]),t=void 0),p.renderState(n,"geometry",t)}},React.createElement(List,null,S),React.createElement(Box,null,React.createElement(Button,{disabled:!G,onClick:T,ref:B,startIcon:React.createElement(Plus,null),title:d,variant:"outlined"},React.createElement(Markdown,{inline:!0,text:s||""}))))};export default GeometryPicker;

package/forms/components/ItemPicker.js

@@ -1 +1 @@
-import Checkbox from"@vertigis/react-ui/Checkbox";import FormControl from"@vertigis/react-ui/FormControl";import FormControlLabel from"@vertigis/react-ui/FormControlLabel";import FormLabel from"@vertigis/react-ui/FormLabel";import IconButton from"@vertigis/react-ui/IconButton";import Input from"@vertigis/react-ui/Input";import InputAdornment from"@vertigis/react-ui/InputAdornment";import List from"@vertigis/react-ui/List";import ListItem from"@vertigis/react-ui/ListItem";import ListItemButton from"@vertigis/react-ui/ListItemButton";import ListItemIcon from"@vertigis/react-ui/ListItemIcon";import ListItemText,{listItemTextClasses}from"@vertigis/react-ui/ListItemText";import Radio from"@vertigis/react-ui/Radio";import RadioGroup from"@vertigis/react-ui/RadioGroup";import Stack from"@vertigis/react-ui/Stack";import Typography from"@vertigis/react-ui/Typography";import Close from"@vertigis/react-ui/icons/Close";import{styled}from"@vertigis/react-ui/styles";import clsx from"clsx";import*as React from"react";import{useContext,useEffect,useMemo,useState}from"react";import{Orientation}from"../constants.js";import HostContext from"../hostContext.js";import{getKeyString}from"../keyboard.js";import{areValuesEqual}from"../listUtilities.js";import{debounce,isDataRef,isGeometryRef,makeSafeClassName,makeUniqueId}from"../utils.js";import FormElement from"./FormElement.js";import Markdown from"./Markdown.js";import{useFocusCallback}from"./common.js";const PREFIX="ItemPicker",itemPickerClasses={allNone:`${PREFIX}-all-none`,button:`${PREFIX}-list-item-button`,clearIcon:`${PREFIX}-clear-button`,horizontal:`${PREFIX}-horizontal`,item:`${PREFIX}-list-item`,items:`${PREFIX}-list-items`},StyledFormElement=styled(FormElement)(({theme:{typography:e,spacing:t}})=>({[`.${itemPickerClasses.allNone}`]:{marginLeft:t(2)},[`.${itemPickerClasses.clearIcon}`]:{height:e.pxToRem(20),width:e.pxToRem(20)},[`.${itemPickerClasses.items}`]:{[`&.${itemPickerClasses.horizontal}`]:{display:"flex",flexWrap:"wrap",[`.${itemPickerClasses.item}`]:{width:"auto"}},[`.${itemPickerClasses.item}`]:{[`.${itemPickerClasses.button}`]:{paddingBottom:0,paddingTop:0,[`.${listItemTextClasses.primary}`]:{fontWeight:e.fontWeightRegular}}}}})),ItemPicker=({className:e,component:o,element:t,enabled:i,items:a,name:r,orientation:s,prompt:n,selectionMode:l,setProperty:c,setValue:m,showFilter:d,spacing:u,state:p,value:f})=>{const k=useContext(HostContext);void 0===u&&(u=1);const[g,I]=useState(""),R=a||{};let h=p;const v=useFocusCallback(i,r,k),b=e=>{const t=[];for(const o in R){var i=R[o];i.checked&&t.push(i)}let r;0<t.length&&(r={refValueType:"items",items:t}),areValuesEqual(f,r)||m(r,e)};useEffect(()=>{void 0!==h&&null!==h||(h={items:[],keyToIndex:{}});const e={};for(const i in a){var t=x(i,!1);t&&(e[i]=t)}h.items.length=0,h.keyToIndex={};for(const r in e)h.keyToIndex[r]=h.items.length,h.items.push(e[r]);p!==h&&c("state",h),b(!1)});const x=(e,t=!0)=>{let i=h.keyToIndex[e];if(null==i||null===i){if(!t)return;h.keyToIndex[e]=h.items.length,h.items.push({}),i=h.keyToIndex[e]}return h.items[i]},C=(e,t)=>{R[e].checked=t;const i=x(e);i&&(i.checked=t)};var E=t=>e=>{null!==e&&(v(e),e=!0===R[t].checked,x(t).checked=e)};const y=[];let T;switch(l){case"single":T="radio";break;case"multiple":T="checkbox"}let L={},P={};if(h)for(const K in R){var F,S,$,N,w=R[K];w.checked&&(L[K]=w),x(K).content=(e=>{if(e){if(isGeometryRef(e))return e.geometry;if(isDataRef(e)&&e.data)return e.data.geometry}})(w.value),!1!==w.visible&&(P[K]=w,S=(F=i&&!1!==w.enabled)&&!!T,$=k.renderText(w.tooltip),N=clsx(itemPickerClasses.item,w.styleName?makeSafeClassName(w.styleName):void 0),w=React.createElement(Markdown,{text:w.label}),y.push(React.createElement(ListItem,{className:N,disablePadding:!0,key:K},React.createElement(ListItemButton,{className:itemPickerClasses.button,disabled:!F,onClick:S?(i=>()=>{var e=R[i].checked;if("single"===l){if(!e)for(const t in R)C(t,t===i)}else C(i,!e);b(!0),k.renderState(r,"item-picker",h)})(K):void 0,tabIndex:F?void 0:-1,title:$,"data-id":K,onBlur:F?e=>{delete x(e.currentTarget.dataset.id).focused,k.renderState(r,"item-picker",h)}:void 0,onFocus:F?e=>{x(e.currentTarget.dataset.id).focused=!0,k.renderState(r,"item-picker",h)}:void 0,onMouseOver:F?e=>{x(e.currentTarget.dataset.id).pending=!0,k.renderState(r,"item-picker",h)}:void 0,onMouseOut:F?e=>{delete x(e.currentTarget.dataset.id).pending,k.renderState(r,"item-picker",h)}:void 0},"checkbox"===T&&React.createElement(ListItemIcon,null,React.createElement(Checkbox,{edge:"start",checked:!0===R[K]?.checked,disabled:!F,disableRipple:!0,inputRef:E(K),tabIndex:-1,value:K})),"radio"===T&&React.createElement(ListItemIcon,null,React.createElement(Radio,{edge:"start",checked:!0===R[K]?.checked,disabled:!F,disableRipple:!0,inputRef:E(K),name:r,tabIndex:-1,value:K})),React.createElement(ListItemText,null,w)))))}var M=k.renderText(n);const j=useMemo(()=>e=>{for(const t in R){const i=R[t];if(e){const r=k.renderText(i.label).toLowerCase();i.visible=0<=r.indexOf(e)}else i.visible=!0}o.forceUpdate()},[R]),B=useMemo(()=>debounce(j),[R]);const O=()=>{I(""),j("")};var X="multiple"===l&&0<y.length,z=clsx(itemPickerClasses.items,{[itemPickerClasses.horizontal]:s===Orientation.HORIZONTAL});let A,G=0,q=0,U=0,V=0;for(const Z in R){var W=P[Z];W?(U++,W.checked&&G++):(V++,R[Z].checked&&q++)}0===G?A="none":G===U&&(A="all");n=g?React.createElement(InputAdornment,{position:"end"},React.createElement(IconButton,{disabled:!i,onClick:O,title:k.renderText("@common-clear")},React.createElement(Close,{className:itemPickerClasses.clearIcon}))):null,s=d?`${makeUniqueId(r)}-filter`:void 0;let D,H=k.renderText("@item-picker-select");return X&&0<V&&(H=k.renderText("@item-picker-select-visible"),0<q&&(D=1===q?k.renderText("@item-picker-hidden-selected-item"):`${q} ${k.renderText("@item-picker-hidden-selected-items")}`)),React.createElement(StyledFormElement,{className:e,component:"fieldset",element:t,inputId:s,name:r,ref:e=>{null===e?k.renderState(r,"item-picker"):k.renderState(r,"item-picker",h)}},React.createElement(Stack,{spacing:u},d&&React.createElement(Input,{disabled:!i,endAdornment:n,error:!1,fullWidth:!0,id:s,inputRef:v,onChange:e=>{const t=e.target.value;I(t),B(t.toLowerCase())},onKeyDown:e=>{"escape"===getKeyString(e)&&O()},placeholder:M,type:"text",value:g}),X&&React.createElement(FormControl,{className:itemPickerClasses.allNone},React.createElement(FormLabel,null,H),React.createElement(RadioGroup,{color:"primary",row:!0},React.createElement(FormControlLabel,{value:"all",checked:"all"===A,control:React.createElement(Radio,{size:"small"}),disabled:!i,inputRef:v,onClick:()=>{for(const e in P)C(e,!0);b(!0)},label:k.renderText("@common-all")}),React.createElement(FormControlLabel,{value:"none",checked:"none"===A,control:React.createElement(Radio,{size:"small"}),disabled:!i,onClick:()=>{for(const e in P)C(e,!1);b(!0)},label:k.renderText("@common-none")})),D&&React.createElement(Typography,{variant:"subtitle2"},D)),React.createElement(List,{className:z,dense:!0},y)))};export default ItemPicker;export{itemPickerClasses};
+import Checkbox from"@vertigis/react-ui/Checkbox";import FormControl from"@vertigis/react-ui/FormControl";import FormControlLabel from"@vertigis/react-ui/FormControlLabel";import FormLabel from"@vertigis/react-ui/FormLabel";import IconButton from"@vertigis/react-ui/IconButton";import Input from"@vertigis/react-ui/Input";import InputAdornment from"@vertigis/react-ui/InputAdornment";import List from"@vertigis/react-ui/List";import ListItem from"@vertigis/react-ui/ListItem";import ListItemButton from"@vertigis/react-ui/ListItemButton";import ListItemIcon from"@vertigis/react-ui/ListItemIcon";import ListItemText,{listItemTextClasses}from"@vertigis/react-ui/ListItemText";import Radio from"@vertigis/react-ui/Radio";import RadioGroup from"@vertigis/react-ui/RadioGroup";import Stack from"@vertigis/react-ui/Stack";import Typography from"@vertigis/react-ui/Typography";import Close from"@vertigis/react-ui/icons/Close";import{styled}from"@vertigis/react-ui/styles";import clsx from"clsx";import*as React from"react";import{useContext,useEffect,useMemo,useState}from"react";import{Orientation}from"../constants.js";import HostContext from"../hostContext.js";import{getKeyString}from"../keyboard.js";import{areValuesEqual}from"../listUtilities.js";import{debounce,isDataRef,isGeometryRef,makeSafeClassName,makeUniqueId}from"../utils.js";import FormElement from"./FormElement.js";import Markdown from"./Markdown.js";import{useFocusCallback}from"./common.js";const PREFIX="ItemPicker",itemPickerClasses={allNone:`${PREFIX}-all-none`,button:`${PREFIX}-list-item-button`,clearIcon:`${PREFIX}-clear-button`,horizontal:`${PREFIX}-horizontal`,item:`${PREFIX}-list-item`,items:`${PREFIX}-list-items`},StyledFormElement=styled(FormElement)(({theme:{typography:e,spacing:t}})=>({[`.${itemPickerClasses.allNone}`]:{marginLeft:t(2)},[`.${itemPickerClasses.clearIcon}`]:{height:e.pxToRem(20),width:e.pxToRem(20)},[`.${itemPickerClasses.items}`]:{[`&.${itemPickerClasses.horizontal}`]:{display:"flex",flexWrap:"wrap",[`.${itemPickerClasses.item}`]:{width:"auto"}},[`.${itemPickerClasses.item}`]:{[`.${itemPickerClasses.button}`]:{paddingBottom:0,paddingTop:0,[`.${listItemTextClasses.primary}`]:{fontWeight:e.fontWeightRegular}}}}})),ItemPicker=({className:e,component:o,element:t,enabled:r,items:a,name:i,orientation:s,prompt:n,selectionMode:l,setProperty:c,setValue:m,showFilter:d,spacing:u,state:p,value:f})=>{const k=useContext(HostContext);void 0===u&&(u=1);const[g,I]=useState(""),h=a||{};let R=p;const v=useFocusCallback(r,i,k),b=e=>{const t=[];for(const o in h){var r=h[o];r.checked&&t.push(r)}let i;0<t.length&&(i={refValueType:"items",items:t}),areValuesEqual(f,i)||m(i,e)};useEffect(()=>{void 0!==R&&null!==R||(R={items:[],keyToIndex:{}});const e={};for(const r in a){var t=x(r,!1);t&&(e[r]=t)}R.items.length=0,R.keyToIndex={};for(const i in e)R.keyToIndex[i]=R.items.length,R.items.push(e[i]);p!==R&&c("state",R),b(!1)});const x=(e,t=!0)=>{let r=R.keyToIndex[e];if(null==r||null===r){if(!t)return;R.keyToIndex[e]=R.items.length,R.items.push({}),r=R.keyToIndex[e]}return R.items[r]},C=(e,t)=>{h[e].checked=t;const r=x(e);r&&(r.checked=t)};var E=t=>e=>{null!==e&&(v(e),e=!0===h[t].checked,x(t).checked=e)};const y=[];let T;switch(l){case"single":T="radio";break;case"multiple":T="checkbox"}const P={},L={};if(R)for(const K in h){var F,S,$,N,w=h[K];w.checked&&(P[K]=w),x(K).content=(e=>{if(e){if(isGeometryRef(e))return e.geometry;if(isDataRef(e)&&e.data)return e.data.geometry}})(w.value),!1!==w.visible&&(L[K]=w,S=(F=r&&!1!==w.enabled)&&!!T,$=k.renderText(w.tooltip),N=clsx(itemPickerClasses.item,w.styleName?makeSafeClassName(w.styleName):void 0),w=React.createElement(Markdown,{text:w.label}),y.push(React.createElement(ListItem,{className:N,disablePadding:!0,key:K},React.createElement(ListItemButton,{className:itemPickerClasses.button,disabled:!F,onClick:S?(r=>()=>{var e=h[r].checked;if("single"===l){if(!e)for(const t in h)C(t,t===r)}else C(r,!e);b(!0),k.renderState(i,"item-picker",R)})(K):void 0,tabIndex:F?void 0:-1,title:$,"data-id":K,onBlur:F?e=>{delete x(e.currentTarget.dataset.id).focused,k.renderState(i,"item-picker",R)}:void 0,onFocus:F?e=>{x(e.currentTarget.dataset.id).focused=!0,k.renderState(i,"item-picker",R)}:void 0,onMouseOver:F?e=>{x(e.currentTarget.dataset.id).pending=!0,k.renderState(i,"item-picker",R)}:void 0,onMouseOut:F?e=>{delete x(e.currentTarget.dataset.id).pending,k.renderState(i,"item-picker",R)}:void 0},"checkbox"===T&&React.createElement(ListItemIcon,null,React.createElement(Checkbox,{edge:"start",checked:!0===h[K]?.checked,disabled:!F,disableRipple:!0,slotProps:{input:{ref:E(K)}},tabIndex:-1,value:K})),"radio"===T&&React.createElement(ListItemIcon,null,React.createElement(Radio,{edge:"start",checked:!0===h[K]?.checked,disabled:!F,disableRipple:!0,name:i,slotProps:{input:{ref:E(K)}},tabIndex:-1,value:K})),React.createElement(ListItemText,null,w)))))}var M=k.renderText(n);const j=useMemo(()=>e=>{for(const t in h){const r=h[t];if(e){const i=k.renderText(r.label).toLowerCase();r.visible=0<=i.indexOf(e)}else r.visible=!0}o.forceUpdate()},[h]),B=useMemo(()=>debounce(j),[h]);const O=()=>{I(""),j("")};var X="multiple"===l&&0<y.length,z=clsx(itemPickerClasses.items,{[itemPickerClasses.horizontal]:s===Orientation.HORIZONTAL});let A,G=0,q=0,U=0,V=0;for(const Z in h){var W=L[Z];W?(U++,W.checked&&G++):(V++,h[Z].checked&&q++)}0===G?A="none":G===U&&(A="all");n=g?React.createElement(InputAdornment,{position:"end"},React.createElement(IconButton,{disabled:!r,onClick:O,title:k.renderText("@common-clear")},React.createElement(Close,{className:itemPickerClasses.clearIcon}))):null,s=d?`${makeUniqueId(i)}-filter`:void 0;let D,H=k.renderText("@item-picker-select");return X&&0<V&&(H=k.renderText("@item-picker-select-visible"),0<q&&(D=1===q?k.renderText("@item-picker-hidden-selected-item"):`${q} ${k.renderText("@item-picker-hidden-selected-items")}`)),React.createElement(StyledFormElement,{className:e,component:"fieldset",element:t,inputId:s,name:i,ref:e=>{null===e?k.renderState(i,"item-picker"):k.renderState(i,"item-picker",R)}},React.createElement(Stack,{spacing:u},d&&React.createElement(Input,{disabled:!r,endAdornment:n,error:!1,fullWidth:!0,id:s,inputRef:v,onChange:e=>{const t=e.target.value;I(t),B(t.toLowerCase())},onKeyDown:e=>{"escape"===getKeyString(e)&&O()},placeholder:M,type:"text",value:g}),X&&React.createElement(FormControl,{className:itemPickerClasses.allNone},React.createElement(FormLabel,null,H),React.createElement(RadioGroup,{color:"primary",row:!0},React.createElement(FormControlLabel,{value:"all",checked:"all"===A,control:React.createElement(Radio,{size:"small"}),disabled:!r,inputRef:v,onClick:()=>{for(const e in L)C(e,!0);b(!0)},label:k.renderText("@common-all")}),React.createElement(FormControlLabel,{value:"none",checked:"none"===A,control:React.createElement(Radio,{size:"small"}),disabled:!r,onClick:()=>{for(const e in L)C(e,!1);b(!0)},label:k.renderText("@common-none")})),D&&React.createElement(Typography,{variant:"subtitle2"},D)),React.createElement(List,{className:z,dense:!0},y)))};export default ItemPicker;export{itemPickerClasses};

package/forms/components/Number.js

@@ -1 +1 @@
-import{inputClasses}from"@vertigis/react-ui/Input";import InputAdornment from"@vertigis/react-ui/InputAdornment";import{NumberFormatContext}from"@vertigis/react-ui/NumberFormatContext";import NumberInput from"@vertigis/react-ui/NumberInput";import{styled}from"@vertigis/react-ui/styles";import clsx from"clsx";import*as React from"react";import{useContext,useEffect,useMemo,useRef,useState}from"react";import{FormElementSize}from"../constants.js";import{countDecimalsInCustomFormat,customFormatNumber,parseCustomFormattedNumber}from"../customNumberFormat.js";import{numberFormatConfiguration}from"../elements/Number.js";import HostContext from"../hostContext.js";import{getKeyString}from"../keyboard.js";import{NumberDisplayFormat,DEFAULT_CURRENCY,DEFAULT_CUSTOM_FORMAT}from"../numberFormatter.js";import{areValuesEqual,enforceConstraints,getCurrencySymbolInfo,getNumberConstraints,getPercentSymbolInfo,preciseRound,sanitizePrecision}from"../numberUtilities.js";import{isNumber,isNumberRef,isString,makeUniqueId,useLocale}from"../utils.js";import FormElement from"./FormElement.js";import{useFocusCallback}from"./common.js";const PREFIX="Number",numberClasses={large:`${PREFIX}-large`,medium:`${PREFIX}-medium`,small:`${PREFIX}-small`},StyledFormElement=styled(FormElement)(()=>({[`.${inputClasses.root}`]:{[`&.${numberClasses.large}`]:{width:"50%"},[`&.${numberClasses.medium}`]:{width:"33%"},[`&.${numberClasses.small}`]:{width:"25%"}}})),NumberComponent=({className:e,element:r,enabled:t,error:o,format:p,name:m,prompt:n,require:s,tooltip:a,value:i,setValue:u})=>{const l=useContext(HostContext),[c,b]=useState(!1),[f,d]=useState(),F=useRef(!0),C=`${makeUniqueId(m)}-input`,N=useLocale(),y=l.renderText(n),E=l.renderText(a),{currency:g,customDisplayFormat:D,decimals:R,displayFormat:v,endAdornment:I,isCustom:S,isFixedPoint:x,isPercent:P,numberConstraints:T,startAdornment:A}=useMemo(()=>{var e,r,t=p,o=t?.currency||DEFAULT_CURRENCY,m=t?.displayFormat,n=m===NumberDisplayFormat.CUSTOM,s=m===NumberDisplayFormat.FIXED_POINT,a=m===NumberDisplayFormat.PERCENT,i=getNumberConstraints(t,numberFormatConfiguration),u=t?.customDisplayFormat||DEFAULT_CUSTOM_FORMAT,t=m===NumberDisplayFormat.CUSTOM?-1:sanitizePrecision(t?.precision,i.step,numberFormatConfiguration);let l=null,c=null;return m===NumberDisplayFormat.CURRENCY||m===NumberDisplayFormat.ACCOUNTING?(e=getCurrencySymbolInfo(N,o))&&(r=React.createElement(InputAdornment,{position:e.position},e.symbol),"start"===e.position?l=r:c=r):!a||(e=getPercentSymbolInfo(N))&&(r=React.createElement(InputAdornment,{position:e.position},e.symbol),"start"===e.position?l=r:c=r),{currency:o,customDisplayFormat:u,decimals:t,displayFormat:m,endAdornment:c,isCustom:n,isFixedPoint:s,isPercent:a,numberConstraints:i,startAdornment:l}},[p]);n=useMemo(()=>v===NumberDisplayFormat.CUSTOM?countDecimalsInCustomFormat(D,f):-1,[f]);const{maximum:U,minimum:M,step:j}=T;a=P?R-2:R,a=Math.max(0,a);const z={currency:g,customDisplayFormat:D,format:v,fractionalDigits:a,locale:N},O=e=>{if("number"==typeof e)return{refValueType:"number",format:{lowerBound:M,precision:R,step:j,upperBound:U},display:l.formatNumber(e,z),numeric:e}},$=()=>{e=void 0===(e=f)?void 0:enforceConstraints(e,T),e=O(e);areValuesEqual(i,e)||u(e);var e=e?.numeric;e!==f&&d(e)};useEffect(()=>{F.current?F.current=!1:c||$()},[c,f]),useEffect(()=>{var e=h(i),r=void 0===e?void 0:O(e);areValuesEqual(i,r)||u(r,!1),e!==f&&d(e)},[i]);const h=e=>{let r;if(isNumber(e))r=e;else if(isString(e)){if(!e)return;r=l.coerceNumber(e,N)}else"number"==typeof e?.numeric&&(r=e.numeric);return"number"==typeof r&&0*r!=0&&(r=void 0),void 0===r?r:enforceConstraints(r,T)},q=e=>{var r,t=getKeyString(e);return"enter"===t?(r=e,$(),r.currentTarget.select(),r.stopPropagation(),r.preventDefault(),!1):"escape"===t?(t=e,(e=isNumberRef(i)?i.numeric:void 0)!==f&&d(e),t.currentTarget.select(),t.stopPropagation(),t.preventDefault(),!1):void 0},L=useFocusCallback(t,m,l);a="string"==typeof r.size?r.size:FormElementSize.Full;const _=S?n:R,w=clsx({[numberClasses.large]:a===FormElementSize.Large,[numberClasses.medium]:a===FormElementSize.Medium,[numberClasses.small]:a===FormElementSize.Small});return React.createElement(StyledFormElement,{className:e,element:r,inputId:C,name:m},e=>React.createElement(NumberFormatContext.Provider,{value:{formatNumber:e=>{if(S)return customFormatNumber(e,D,z.locale);P&&(e*=100);var r={format:x?z.format:void 0,fractionalDigits:z.fractionalDigits,locale:z.locale};return l.formatNumber(e,r)},parseNumber:e=>{if(S)return parseCustomFormattedNumber(e,D,z.locale);let r=l.coerceNumber(e,N);return P&&(r=preciseRound(r/100,R)),r}}},React.createElement(NumberInput,{allowUndefined:!0,className:w,correctOnBlur:!0,disabled:!t,endAdornment:I,error:!!o,inputProps:{...e,id:C,onKeyDown:q,title:E},inputRef:L,max:U,maxDecimalPlaces:_,min:M,onBlur:()=>{b(!1)},onChange:e=>d(e),onFocus:()=>{b(!0)},placeholder:y,required:s,size:"small",startAdornment:A,value:f})))};export default NumberComponent;export{numberClasses};
+import{inputClasses}from"@vertigis/react-ui/Input";import InputAdornment from"@vertigis/react-ui/InputAdornment";import{NumberFormatContext}from"@vertigis/react-ui/NumberFormatContext";import NumberInput from"@vertigis/react-ui/NumberInput";import{styled}from"@vertigis/react-ui/styles";import clsx from"clsx";import*as React from"react";import{useContext,useEffect,useMemo,useRef,useState}from"react";import{FormElementSize}from"../constants.js";import{countDecimalsInCustomFormat,customFormatNumber,parseCustomFormattedNumber}from"../customNumberFormat.js";import{numberFormatConfiguration}from"../elements/Number.js";import HostContext from"../hostContext.js";import{getKeyString}from"../keyboard.js";import{NumberDisplayFormat,DEFAULT_CURRENCY,DEFAULT_CUSTOM_FORMAT}from"../numberFormatter.js";import{areValuesEqual,enforceConstraints,getCurrencySymbolInfo,getNumberConstraints,getPercentSymbolInfo,preciseRound,sanitizePrecision}from"../numberUtilities.js";import{isNumber,isNumberRef,isString,makeUniqueId,useLocale}from"../utils.js";import FormElement from"./FormElement.js";import{useFocusCallback}from"./common.js";const PREFIX="Number",numberClasses={large:`${PREFIX}-large`,medium:`${PREFIX}-medium`,small:`${PREFIX}-small`},StyledFormElement=styled(FormElement)(()=>({[`.${inputClasses.root}`]:{[`&.${numberClasses.large}`]:{width:"50%"},[`&.${numberClasses.medium}`]:{width:"33%"},[`&.${numberClasses.small}`]:{width:"25%"}}})),NumberComponent=({className:e,element:r,enabled:t,error:m,format:p,name:o,prompt:s,require:n,tooltip:a,value:i,setValue:u})=>{const l=useContext(HostContext),[c,f]=useState(!1),[b,d]=useState(),F=useRef(!0),C=`${makeUniqueId(o)}-input`,N=useLocale(),y=l.renderText(s),E=l.renderText(a),{currency:g,customDisplayFormat:R,decimals:D,displayFormat:I,endAdornment:S,isCustom:v,isFixedPoint:x,isPercent:P,numberConstraints:T,startAdornment:A}=useMemo(()=>{var e,r,t=p,m=t?.currency||DEFAULT_CURRENCY,o=t?.displayFormat,s=o===NumberDisplayFormat.CUSTOM,n=o===NumberDisplayFormat.FIXED_POINT,a=o===NumberDisplayFormat.PERCENT,i=getNumberConstraints(t,numberFormatConfiguration),u=t?.customDisplayFormat||DEFAULT_CUSTOM_FORMAT,t=o===NumberDisplayFormat.CUSTOM?-1:sanitizePrecision(t?.precision,i.step,numberFormatConfiguration);let l=null,c=null;return o===NumberDisplayFormat.CURRENCY||o===NumberDisplayFormat.ACCOUNTING?(e=getCurrencySymbolInfo(N,m))&&(r=React.createElement(InputAdornment,{position:e.position},e.symbol),"start"===e.position?l=r:c=r):!a||(e=getPercentSymbolInfo(N))&&(r=React.createElement(InputAdornment,{position:e.position},e.symbol),"start"===e.position?l=r:c=r),{currency:m,customDisplayFormat:u,decimals:t,displayFormat:o,endAdornment:c,isCustom:s,isFixedPoint:n,isPercent:a,numberConstraints:i,startAdornment:l}},[p]);s=useMemo(()=>I===NumberDisplayFormat.CUSTOM?countDecimalsInCustomFormat(R,b):-1,[b]);const{maximum:U,minimum:M,step:j}=T;a=P?D-2:D,a=Math.max(0,a);const z={currency:g,customDisplayFormat:R,format:I,fractionalDigits:a,locale:N},O=e=>{if("number"==typeof e)return{refValueType:"number",format:{lowerBound:M,precision:D,step:j,upperBound:U},display:l.formatNumber(e,z),numeric:e}},$=()=>{e=void 0===(e=b)?void 0:enforceConstraints(e,T),e=O(e);areValuesEqual(i,e)||u(e);var e=e?.numeric;e!==b&&d(e)};useEffect(()=>{F.current?F.current=!1:c||$()},[c,b]),useEffect(()=>{var e=h(i),r=void 0===e?void 0:O(e);areValuesEqual(i,r)||u(r,!1),e!==b&&d(e)},[i]);const h=e=>{let r;if(isNumber(e))r=e;else if(isString(e)){if(!e)return;r=l.coerceNumber(e,N)}else"number"==typeof e?.numeric&&(r=e.numeric);return"number"==typeof r&&0*r!=0&&(r=void 0),void 0===r?r:enforceConstraints(r,T)},q=e=>{var r=getKeyString(e);if("enter"===r)$();else if("escape"===r)return r=e,(e=isNumberRef(i)?i.numeric:void 0)!==b&&d(e),r.currentTarget.select(),r.stopPropagation(),r.preventDefault(),!1},L=useFocusCallback(t,o,l);a="string"==typeof r.size?r.size:FormElementSize.Full;const _=v?s:D,w=clsx({[numberClasses.large]:a===FormElementSize.Large,[numberClasses.medium]:a===FormElementSize.Medium,[numberClasses.small]:a===FormElementSize.Small});return React.createElement(StyledFormElement,{className:e,element:r,inputId:C,name:o},e=>React.createElement(NumberFormatContext.Provider,{value:{formatNumber:e=>{if(v)return customFormatNumber(e,R,z.locale);P&&(e*=100);var r={format:x?z.format:void 0,fractionalDigits:z.fractionalDigits,locale:z.locale};return l.formatNumber(e,r)},parseNumber:e=>{if(v)return parseCustomFormattedNumber(e,R,z.locale);let r=l.coerceNumber(e,N);return P&&(r=preciseRound(r/100,D)),r}}},React.createElement(NumberInput,{allowUndefined:!0,className:w,correctOnBlur:!0,disabled:!t,endAdornment:S,error:!!m,inputProps:{...e,id:C,onKeyDown:q,title:E},inputRef:L,max:U,maxDecimalPlaces:_,min:M,onBlur:()=>{f(!1)},onChange:e=>d(e),onFocus:()=>{f(!0)},placeholder:y,required:n,size:"small",startAdornment:A,value:b})))};export default NumberComponent;export{numberClasses};

package/forms/components/NumberRangeSlider.js

@@ -1 +1 @@
-import Box from"@vertigis/react-ui/Box";import{formControlClasses}from"@vertigis/react-ui/FormControl";import InputAdornment from"@vertigis/react-ui/InputAdornment";import{NumberFormatContext}from"@vertigis/react-ui/NumberFormatContext";import Slider,{sliderClasses}from"@vertigis/react-ui/Slider";import Stack from"@vertigis/react-ui/Stack";import{styled}from"@vertigis/react-ui/styles";import{useContext,useEffect,useMemo,useRef,useState}from"react";import*as React from"react";import{countDecimalsInCustomFormat,customFormatNumber,parseCustomFormattedNumber}from"../customNumberFormat.js";import{numberFormatConfiguration}from"../elements/NumberRangeSlider.js";import HostContext from"../hostContext.js";import{DEFAULT_CURRENCY,DEFAULT_CUSTOM_FORMAT,NumberDisplayFormat}from"../numberFormatter.js";import{getCurrencySymbolInfo,getPercentSymbolInfo,preciseRound}from"../numberUtilities.js";import{getMarks,getNumberConstraints,getNumberSliderValues,sanitizePrecision}from"../numberUtilities.js";import{makeUniqueId,throttle,useLocale}from"../utils.js";import FormElement from"./FormElement.js";import FormLabelNumberField from"./FormLabelNumberField.js";import{useFocusCallback}from"./common.js";const PREFIX="NumberRangeSlider",numberRangeSliderClasses={container:`${PREFIX}-container`,inputContainer:`${PREFIX}-input-container`,toLabel:`${PREFIX}-to-label`},StyledFormElement=styled(FormElement)(({theme:{spacing:e}})=>({[`.${numberRangeSliderClasses.container}`]:{display:"inline-flex",flexDirection:"column",paddingLeft:e(2),paddingRight:e(2),paddingTop:e(4),width:"100%",[`.${sliderClasses.markLabel}`]:{transform:"translateX(-100%)",'&[data-index="0"]':{transform:"none"}},[`.${numberRangeSliderClasses.inputContainer}`]:{marginTop:e(1),[`.${formControlClasses.root}`]:{flexGrow:1},[`.${numberRangeSliderClasses.toLabel}`]:{marginLeft:e(2),marginRight:e(2),paddingTop:e(2),alignSelf:"center"}}}})),NumberRangeSlider=({className:e,element:t,enabled:r,format:d,manualEntry:a,showMinMaxLabels:o,showTickMarks:m,name:n,raiseEvent:i,title:s,tooltip:l,value:u,setValue:c})=>{const p=useContext(HostContext),b=useLocale(),{currency:C,customDisplayFormat:F,decimals:f,displayFormat:g,endAdornment:N,isCustom:R,isFixedPoint:y,isPercent:S,numberConstraints:x,startAdornment:E}=useMemo(()=>{var e,t,r=d,a=r?.currency||DEFAULT_CURRENCY,o=r?.displayFormat,m=o===NumberDisplayFormat.CUSTOM,n=o===NumberDisplayFormat.FIXED_POINT,i=o===NumberDisplayFormat.PERCENT,s=getNumberConstraints(r,numberFormatConfiguration),l=r?.customDisplayFormat||DEFAULT_CUSTOM_FORMAT,r=o===NumberDisplayFormat.CUSTOM?-1:sanitizePrecision(r?.precision,s.step,numberFormatConfiguration);let u=null,c=null;return o===NumberDisplayFormat.CURRENCY||o===NumberDisplayFormat.ACCOUNTING?(e=getCurrencySymbolInfo(b,a))&&(t=React.createElement(InputAdornment,{position:e.position},e.symbol),"start"===e.position?u=t:c=t):!i||(e=getPercentSymbolInfo(b))&&(t=React.createElement(InputAdornment,{position:e.position},e.symbol),"start"===e.position?u=t:c=t),{currency:a,customDisplayFormat:l,decimals:r,displayFormat:o,endAdornment:c,isCustom:m,isFixedPoint:n,isPercent:i,numberConstraints:s,startAdornment:u}},[d]);var v=x["step"];const D=x.maximum,A=x.minimum,[T,I]=useState(!1),[L,P]=useState(!1),[M,U]=useState([A,D]);var h=useMemo(()=>g===NumberDisplayFormat.CUSTOM?[countDecimalsInCustomFormat(F,M[0]),countDecimalsInCustomFormat(F,M[1])]:[-1,-1],[M]);const $=useRef(!0),[k,j]=useMemo(()=>{var e=makeUniqueId(n);return[e,`${e}-slider-input`]},[n]);var O=!1!==o,_=!!m,o=!1!==a,m=S?f-2:f,m=Math.max(0,m);const X={currency:C,customDisplayFormat:F,format:g,fractionalDigits:m,locale:b};useEffect(()=>{var e;$.current?$.current=!1:L?B(M):T||(e=getNumberSliderValues(M,x),M[0]===e[0]&&M[1]===e[1]||U(e),w(u,e)||c(e))},[T,L,M]),useEffect(()=>{var e=getNumberSliderValues(u,x);w(u,e)||c(e,!1),w(M,e)||U(e)},[u]);const w=(e,t)=>void 0===e&&void 0===t[0]&&void 0===t[1]||(void 0===e&&null===t[0]&&null===t[1]||!(!Array.isArray(e)||2!==e.length||e[0]!==t[0]||e[1]!==t[1])),B=useMemo(()=>throttle(e=>{i("dragged",e)}),[]),V=useFocusCallback(r,n,p);a=p.renderText(l),m=!r&&!L,l=o?{max:D,min:A,onBlur:()=>{I(!1)},onFocus:()=>{I(!0)},step:v,title:a}:void 0,h=R?h:[f,f];return React.createElement(StyledFormElement,{className:e,element:t,inputId:`${j}-0`,name:n},React.createElement(Box,{className:numberRangeSliderClasses.container},React.createElement(Slider,{disabled:m,getAriaLabel:()=>p.renderText(s),getAriaValueText:e=>p.formatNumber(e,X),marks:getMarks(D,A,v,X,O,_),max:D,min:A,onChange:(e,t)=>{P(!0),Array.isArray(t)&&U(t)},onChangeCommitted:()=>{P(!1)},slotProps:{input:()=>({ref:e=>(null===e||e.id||(e.id=`${j}-${e.getAttribute("data-index")}`),V(e))})},step:v,title:a,value:M,valueLabelDisplay:"on",valueLabelFormat:(e,t)=>p.formatNumber(e,X)}),!1!=o&&React.createElement(NumberFormatContext.Provider,{value:{formatNumber:e=>{if(R)return customFormatNumber(e,F,X.locale);S&&(e*=100);var t={format:y?X.format:void 0,fractionalDigits:X.fractionalDigits,locale:X.locale};return p.formatNumber(e,t)},parseNumber:e=>{if(R)return parseCustomFormattedNumber(e,F,X.locale);let t=p.coerceNumber(e,b);return S&&(t=preciseRound(t/100,f)),t}}},React.createElement(Stack,{direction:"row",className:numberRangeSliderClasses.inputContainer},React.createElement(FormLabelNumberField,{disabled:!r,id:`${k}-startInput`,inputProps:l,endAdornment:N,label:p.renderText("@common-start"),max:D,maxDecimalPlaces:h[0],min:A,onChange:e=>{void 0===e&&(e=A),U([e,M[1]])},startAdornment:E,value:M[0]}),React.createElement(Box,{className:numberRangeSliderClasses.toLabel}," ",p.renderText("@common-to")," "),React.createElement(FormLabelNumberField,{disabled:!r,endAdornment:N,id:`${k}-endInput`,inputProps:l,label:p.renderText("@common-end"),max:D,maxDecimalPlaces:h[1],min:A,onChange:e=>{void 0===e&&(e=D),U([M[0],e])},startAdornment:E,value:M[1]})))))};export default NumberRangeSlider;export{numberRangeSliderClasses};
+import Box from"@vertigis/react-ui/Box";import{formControlClasses}from"@vertigis/react-ui/FormControl";import InputAdornment from"@vertigis/react-ui/InputAdornment";import{NumberFormatContext}from"@vertigis/react-ui/NumberFormatContext";import Slider,{sliderClasses}from"@vertigis/react-ui/Slider";import Stack from"@vertigis/react-ui/Stack";import{styled}from"@vertigis/react-ui/styles";import{useContext,useEffect,useMemo,useRef,useState}from"react";import*as React from"react";import{countDecimalsInCustomFormat,customFormatNumber,parseCustomFormattedNumber}from"../customNumberFormat.js";import{numberFormatConfiguration}from"../elements/NumberRangeSlider.js";import HostContext from"../hostContext.js";import{DEFAULT_CURRENCY,DEFAULT_CUSTOM_FORMAT,NumberDisplayFormat}from"../numberFormatter.js";import{getCurrencySymbolInfo,getPercentSymbolInfo,preciseRound}from"../numberUtilities.js";import{getMarks,getNumberConstraints,getNumberSliderValues,sanitizePrecision}from"../numberUtilities.js";import{makeUniqueId,throttle,useLocale}from"../utils.js";import FormElement from"./FormElement.js";import FormLabelNumberField from"./FormLabelNumberField.js";import{useFocusCallback}from"./common.js";const PREFIX="NumberRangeSlider",numberRangeSliderClasses={container:`${PREFIX}-container`,inputContainer:`${PREFIX}-input-container`,toLabel:`${PREFIX}-to-label`},StyledFormElement=styled(FormElement)(({theme:{spacing:e}})=>({[`.${numberRangeSliderClasses.container}`]:{display:"inline-flex",flexDirection:"column",paddingLeft:e(2),paddingRight:e(2),paddingTop:e(4),width:"100%",[`.${sliderClasses.markLabel}`]:{transform:"translateX(-100%)",'&[data-index="0"]':{transform:"none"}},[`.${numberRangeSliderClasses.inputContainer}`]:{marginTop:e(1),[`.${formControlClasses.root}`]:{flexGrow:1},[`.${numberRangeSliderClasses.toLabel}`]:{marginLeft:e(2),marginRight:e(2),paddingTop:e(2),alignSelf:"center"}}}})),NumberRangeSlider=({className:e,element:t,enabled:r,format:d,manualEntry:a,showMinMaxLabels:o,showTickMarks:m,name:n,raiseEvent:i,title:s,tooltip:l,value:u,setValue:c})=>{const p=useContext(HostContext),b=useLocale(),{currency:C,customDisplayFormat:F,decimals:f,displayFormat:g,endAdornment:N,isCustom:R,isFixedPoint:y,isPercent:S,numberConstraints:x,startAdornment:E}=useMemo(()=>{var e,t,r=d,a=r?.currency||DEFAULT_CURRENCY,o=r?.displayFormat,m=o===NumberDisplayFormat.CUSTOM,n=o===NumberDisplayFormat.FIXED_POINT,i=o===NumberDisplayFormat.PERCENT,s=getNumberConstraints(r,numberFormatConfiguration),l=r?.customDisplayFormat||DEFAULT_CUSTOM_FORMAT,r=o===NumberDisplayFormat.CUSTOM?-1:sanitizePrecision(r?.precision,s.step,numberFormatConfiguration);let u=null,c=null;return o===NumberDisplayFormat.CURRENCY||o===NumberDisplayFormat.ACCOUNTING?(e=getCurrencySymbolInfo(b,a))&&(t=React.createElement(InputAdornment,{position:e.position},e.symbol),"start"===e.position?u=t:c=t):!i||(e=getPercentSymbolInfo(b))&&(t=React.createElement(InputAdornment,{position:e.position},e.symbol),"start"===e.position?u=t:c=t),{currency:a,customDisplayFormat:l,decimals:r,displayFormat:o,endAdornment:c,isCustom:m,isFixedPoint:n,isPercent:i,numberConstraints:s,startAdornment:u}},[d]);var v=x["step"];const D=x.maximum,A=x.minimum,[T,I]=useState(!1),[L,P]=useState(!1),[M,U]=useState([A,D]);var h=useMemo(()=>g===NumberDisplayFormat.CUSTOM?[countDecimalsInCustomFormat(F,M[0]),countDecimalsInCustomFormat(F,M[1])]:[-1,-1],[M]);const $=useRef(!0),[k,j]=useMemo(()=>{var e=makeUniqueId(n);return[e,`${e}-slider-input`]},[n]);var O=!1!==o,_=!!m,o=!1!==a,m=S?f-2:f,m=Math.max(0,m);const X={currency:C,customDisplayFormat:F,format:g,fractionalDigits:m,locale:b};useEffect(()=>{var e;$.current?$.current=!1:L?B(M):T||(e=getNumberSliderValues(M,x),M[0]===e[0]&&M[1]===e[1]||U(e),w(u,e)||c(e))},[T,L,M]),useEffect(()=>{var e=getNumberSliderValues(u,x);w(u,e)||c(e,!1),w(M,e)||U(e)},[u]);const w=(e,t)=>void 0===e&&void 0===t[0]&&void 0===t[1]||(void 0===e&&null===t[0]&&null===t[1]||!(!Array.isArray(e)||2!==e.length||e[0]!==t[0]||e[1]!==t[1])),B=useMemo(()=>throttle(e=>{i("dragged",e)}),[]),V=useFocusCallback(r,n,p);a=p.renderText(l),m=!r&&!L,l=o?{max:D,min:A,onBlur:()=>{I(!1)},onFocus:()=>{I(!0)},step:v,title:a}:void 0,h=R?h:[f,f];return React.createElement(StyledFormElement,{className:e,element:t,inputId:`${j}-0`,name:n},React.createElement(Box,{className:numberRangeSliderClasses.container},React.createElement(Slider,{disabled:m,getAriaLabel:()=>p.renderText(s),getAriaValueText:e=>p.formatNumber(e,X),marks:getMarks(D,A,v,X,O,_),max:D,min:A,onChange:(e,t)=>{P(!0),Array.isArray(t)&&U(t)},onChangeCommitted:()=>{P(!1)},slotProps:{input:()=>({ref:e=>(null===e||e.id||(e.id=`${j}-${e.getAttribute("data-index")}`),V(e))})},step:v,title:a,value:M,valueLabelDisplay:"on",valueLabelFormat:e=>p.formatNumber(e,X)}),!1!=o&&React.createElement(NumberFormatContext.Provider,{value:{formatNumber:e=>{if(R)return customFormatNumber(e,F,X.locale);S&&(e*=100);var t={format:y?X.format:void 0,fractionalDigits:X.fractionalDigits,locale:X.locale};return p.formatNumber(e,t)},parseNumber:e=>{if(R)return parseCustomFormattedNumber(e,F,X.locale);let t=p.coerceNumber(e,b);return S&&(t=preciseRound(t/100,f)),t}}},React.createElement(Stack,{direction:"row",className:numberRangeSliderClasses.inputContainer},React.createElement(FormLabelNumberField,{disabled:!r,id:`${k}-startInput`,inputProps:l,endAdornment:N,label:p.renderText("@common-start"),max:D,maxDecimalPlaces:h[0],min:A,onChange:e=>{void 0===e&&(e=A),U([e,M[1]])},startAdornment:E,value:M[0]}),React.createElement(Box,{className:numberRangeSliderClasses.toLabel}," ",p.renderText("@common-to")," "),React.createElement(FormLabelNumberField,{disabled:!r,endAdornment:N,id:`${k}-endInput`,inputProps:l,label:p.renderText("@common-end"),max:D,maxDecimalPlaces:h[1],min:A,onChange:e=>{void 0===e&&(e=D),U([M[0],e])},startAdornment:E,value:M[1]})))))};export default NumberRangeSlider;export{numberRangeSliderClasses};

package/forms/components/NumberSlider.js

@@ -1 +1 @@
-import Box from"@vertigis/react-ui/Box";import InputAdornment from"@vertigis/react-ui/InputAdornment";import{inputBaseClasses}from"@vertigis/react-ui/InputBase";import{NumberFormatContext}from"@vertigis/react-ui/NumberFormatContext";import NumberInput from"@vertigis/react-ui/NumberInput";import Slider,{sliderClasses}from"@vertigis/react-ui/Slider";import{styled}from"@vertigis/react-ui/styles";import{useContext,useEffect,useMemo,useRef,useState}from"react";import*as React from"react";import{countDecimalsInCustomFormat,customFormatNumber,parseCustomFormattedNumber}from"../customNumberFormat.js";import HostContext from"../hostContext.js";import{DEFAULT_CURRENCY,DEFAULT_CUSTOM_FORMAT,NumberDisplayFormat}from"../numberFormatter.js";import{areValuesEqual,getCurrencySymbolInfo,getMarks,getNumberConstraints,getNumberSliderValues,getPercentSymbolInfo,preciseRound,sanitizePrecision}from"../numberUtilities.js";import{makeUniqueId,throttle,useLocale}from"../utils.js";import FormElement from"./FormElement.js";import{useFocusCallback}from"./common.js";const PREFIX="NumberSlider",numberSliderClasses={container:`${PREFIX}-container`},StyledFormElement=styled(FormElement)(({theme:{spacing:e}})=>({[`.${numberSliderClasses.container}`]:{display:"inline-flex",flexDirection:"column",paddingLeft:e(2),paddingRight:e(2),paddingTop:e(4),width:"100%",[`.${sliderClasses.markLabel}`]:{transform:"translateX(-100%)",'&[data-index="0"]':{transform:"none"}},[`.${inputBaseClasses.root}`]:{marginTop:e(1)}}})),NumberSlider=({className:e,element:t,enabled:r,error:a,format:p,manualEntry:o,showMinMaxLabels:m,showTickMarks:s,name:n,raiseEvent:i,title:u,tooltip:l,value:c,setValue:d})=>{const b=useContext(HostContext),f=useLocale(),{currency:C,customDisplayFormat:F,decimals:N,displayFormat:y,endAdornment:g,isCustom:E,isFixedPoint:S,isPercent:x,numberConstraints:D,startAdornment:R}=useMemo(()=>{var e,t,r=p,a=r?.currency||DEFAULT_CURRENCY,o=r?.displayFormat,m=o===NumberDisplayFormat.CUSTOM,s=o===NumberDisplayFormat.FIXED_POINT,n=o===NumberDisplayFormat.PERCENT,i=getNumberConstraints(r),u=r?.customDisplayFormat||DEFAULT_CUSTOM_FORMAT,r=o===NumberDisplayFormat.CUSTOM?-1:sanitizePrecision(r?.precision,i.step);let l=null,c=null;return o===NumberDisplayFormat.CURRENCY||o===NumberDisplayFormat.ACCOUNTING?(e=getCurrencySymbolInfo(f,a))&&(t=React.createElement(InputAdornment,{position:e.position},e.symbol),"start"===e.position?l=t:c=t):!n||(e=getPercentSymbolInfo(f))&&(t=React.createElement(InputAdornment,{position:e.position},e.symbol),"start"===e.position?l=t:c=t),{currency:a,customDisplayFormat:u,decimals:r,displayFormat:o,endAdornment:c,isCustom:m,isFixedPoint:s,isPercent:n,numberConstraints:i,startAdornment:l}},[p]),v=D["step"],I=D.maximum,A=D.minimum,[T,M]=useState(!1),[P,U]=useState(!1),[h,L]=useState(A);var k=useMemo(()=>y===NumberDisplayFormat.CUSTOM?countDecimalsInCustomFormat(F,h):-1,[h]);const B=useRef(!0);var O=`${makeUniqueId(n)}-input`,V=!1!==m,j=!!s,m=!1!==o,s=x?N-2:N,s=Math.max(0,s);const _={currency:C,customDisplayFormat:F,format:y,fractionalDigits:s,locale:f},q=e=>({refValueType:"number",format:{currency:C,customDisplayFormat:F,displayFormat:y,lowerBound:A,precision:N,step:v,upperBound:I},display:b.formatNumber(e,_),numeric:e});useEffect(()=>{var e;B.current?B.current=!1:P?$(h):T||((e=getNumberSliderValues(h,D,!0)[0])!==h&&L(e),e=q(e),areValuesEqual(c,e)||d(e))},[T,P,h]),useEffect(()=>{var e=getNumberSliderValues(c,D,!0)[0],t=q(e);areValuesEqual(c,t)||d(t,!1),h!==e&&L(e)},[c]);const $=useMemo(()=>throttle(e=>{i("dragged",q(e))}),[]);o=useFocusCallback(r,n,b),s=b.renderText(l),l=!r&&!P,r=!r,k=E?k:N;return React.createElement(StyledFormElement,{className:e,element:t,inputId:O,name:n},React.createElement(Box,{className:numberSliderClasses.container},React.createElement(Slider,{disabled:l,getAriaLabel:()=>b.renderText(u),getAriaValueText:e=>b.formatNumber(e,_),marks:getMarks(I,A,v,_,V,j),max:I,min:A,onChange:(e,t)=>{U(!0);t=Array.isArray(t)?t[0]:t;L(t)},onChangeCommitted:()=>{U(!1)},slotProps:{input:{id:O,ref:o}},step:v,title:s,value:"number"==typeof h?h:0,valueLabelDisplay:"on",valueLabelFormat:(e,t)=>b.formatNumber(e,_)}),!1!=m&&React.createElement(NumberFormatContext.Provider,{value:{formatNumber:e=>{if(E)return customFormatNumber(e,F,_.locale);x&&(e*=100);var t={format:S?_.format:void 0,fractionalDigits:_.fractionalDigits,locale:_.locale};return b.formatNumber(e,t)},parseNumber:e=>{if(E)return parseCustomFormattedNumber(e,F,_.locale);let t=b.coerceNumber(e,f);return x&&(t=preciseRound(t/100,N)),t}}},React.createElement(NumberInput,{correctOnBlur:!0,disabled:r,endAdornment:g,error:!!a,inputProps:{step:v,title:s},max:I,maxDecimalPlaces:k,min:A,onChange:e=>{void 0===e?L(A):L(e)},onFocus:()=>{M(!0)},onBlur:()=>{M(!1)},size:"small",startAdornment:R,value:h}))))};export default NumberSlider;export{numberSliderClasses};
+import Box from"@vertigis/react-ui/Box";import InputAdornment from"@vertigis/react-ui/InputAdornment";import{inputBaseClasses}from"@vertigis/react-ui/InputBase";import{NumberFormatContext}from"@vertigis/react-ui/NumberFormatContext";import NumberInput from"@vertigis/react-ui/NumberInput";import Slider,{sliderClasses}from"@vertigis/react-ui/Slider";import{styled}from"@vertigis/react-ui/styles";import{useContext,useEffect,useMemo,useRef,useState}from"react";import*as React from"react";import{countDecimalsInCustomFormat,customFormatNumber,parseCustomFormattedNumber}from"../customNumberFormat.js";import HostContext from"../hostContext.js";import{DEFAULT_CURRENCY,DEFAULT_CUSTOM_FORMAT,NumberDisplayFormat}from"../numberFormatter.js";import{areValuesEqual,getCurrencySymbolInfo,getMarks,getNumberConstraints,getNumberSliderValues,getPercentSymbolInfo,preciseRound,sanitizePrecision}from"../numberUtilities.js";import{makeUniqueId,throttle,useLocale}from"../utils.js";import FormElement from"./FormElement.js";import{useFocusCallback}from"./common.js";const PREFIX="NumberSlider",numberSliderClasses={container:`${PREFIX}-container`},StyledFormElement=styled(FormElement)(({theme:{spacing:e}})=>({[`.${numberSliderClasses.container}`]:{display:"inline-flex",flexDirection:"column",paddingLeft:e(2),paddingRight:e(2),paddingTop:e(4),width:"100%",[`.${sliderClasses.markLabel}`]:{transform:"translateX(-100%)",'&[data-index="0"]':{transform:"none"}},[`.${inputBaseClasses.root}`]:{marginTop:e(1)}}})),NumberSlider=({className:e,element:t,enabled:r,error:a,format:p,manualEntry:o,showMinMaxLabels:m,showTickMarks:s,name:n,raiseEvent:i,title:u,tooltip:l,value:c,setValue:d})=>{const b=useContext(HostContext),f=useLocale(),{currency:C,customDisplayFormat:F,decimals:N,displayFormat:y,endAdornment:g,isCustom:E,isFixedPoint:S,isPercent:x,numberConstraints:D,startAdornment:R}=useMemo(()=>{var e,t,r=p,a=r?.currency||DEFAULT_CURRENCY,o=r?.displayFormat,m=o===NumberDisplayFormat.CUSTOM,s=o===NumberDisplayFormat.FIXED_POINT,n=o===NumberDisplayFormat.PERCENT,i=getNumberConstraints(r),u=r?.customDisplayFormat||DEFAULT_CUSTOM_FORMAT,r=o===NumberDisplayFormat.CUSTOM?-1:sanitizePrecision(r?.precision,i.step);let l=null,c=null;return o===NumberDisplayFormat.CURRENCY||o===NumberDisplayFormat.ACCOUNTING?(e=getCurrencySymbolInfo(f,a))&&(t=React.createElement(InputAdornment,{position:e.position},e.symbol),"start"===e.position?l=t:c=t):!n||(e=getPercentSymbolInfo(f))&&(t=React.createElement(InputAdornment,{position:e.position},e.symbol),"start"===e.position?l=t:c=t),{currency:a,customDisplayFormat:u,decimals:r,displayFormat:o,endAdornment:c,isCustom:m,isFixedPoint:s,isPercent:n,numberConstraints:i,startAdornment:l}},[p]),v=D["step"],I=D.maximum,A=D.minimum,[T,M]=useState(!1),[P,U]=useState(!1),[h,L]=useState(A);var k=useMemo(()=>y===NumberDisplayFormat.CUSTOM?countDecimalsInCustomFormat(F,h):-1,[h]);const B=useRef(!0);var O=`${makeUniqueId(n)}-input`,V=!1!==m,j=!!s,m=!1!==o,s=x?N-2:N,s=Math.max(0,s);const _={currency:C,customDisplayFormat:F,format:y,fractionalDigits:s,locale:f},q=e=>({refValueType:"number",format:{currency:C,customDisplayFormat:F,displayFormat:y,lowerBound:A,precision:N,step:v,upperBound:I},display:b.formatNumber(e,_),numeric:e});useEffect(()=>{var e;B.current?B.current=!1:P?$(h):T||((e=getNumberSliderValues(h,D,!0)[0])!==h&&L(e),e=q(e),areValuesEqual(c,e)||d(e))},[T,P,h]),useEffect(()=>{var e=getNumberSliderValues(c,D,!0)[0],t=q(e);areValuesEqual(c,t)||d(t,!1),h!==e&&L(e)},[c]);const $=useMemo(()=>throttle(e=>{i("dragged",q(e))}),[]);o=useFocusCallback(r,n,b),s=b.renderText(l),l=!r&&!P,r=!r,k=E?k:N;return React.createElement(StyledFormElement,{className:e,element:t,inputId:O,name:n},React.createElement(Box,{className:numberSliderClasses.container},React.createElement(Slider,{disabled:l,getAriaLabel:()=>b.renderText(u),getAriaValueText:e=>b.formatNumber(e,_),marks:getMarks(I,A,v,_,V,j),max:I,min:A,onChange:(e,t)=>{U(!0);t=Array.isArray(t)?t[0]:t;L(t)},onChangeCommitted:()=>{U(!1)},slotProps:{input:{id:O,ref:o}},step:v,title:s,value:"number"==typeof h?h:0,valueLabelDisplay:"on",valueLabelFormat:e=>b.formatNumber(e,_)}),!1!=m&&React.createElement(NumberFormatContext.Provider,{value:{formatNumber:e=>{if(E)return customFormatNumber(e,F,_.locale);x&&(e*=100);var t={format:S?_.format:void 0,fractionalDigits:_.fractionalDigits,locale:_.locale};return b.formatNumber(e,t)},parseNumber:e=>{if(E)return parseCustomFormattedNumber(e,F,_.locale);let t=b.coerceNumber(e,f);return x&&(t=preciseRound(t/100,N)),t}}},React.createElement(NumberInput,{correctOnBlur:!0,disabled:r,endAdornment:g,error:!!a,inputProps:{step:v,title:s},max:I,maxDecimalPlaces:k,min:A,onChange:e=>{void 0===e?L(A):L(e)},onFocus:()=>{M(!0)},onBlur:()=>{M(!1)},size:"small",startAdornment:R,value:h}))))};export default NumberSlider;export{numberSliderClasses};

package/forms/components/RadioGroup.js

@@ -1 +1 @@
-import FormControlLabel from"@vertigis/react-ui/FormControlLabel";import Radio from"@vertigis/react-ui/Radio";import BaseRadioGroup from"@vertigis/react-ui/RadioGroup";import{styled}from"@vertigis/react-ui/styles";import*as React from"react";import{useContext,useEffect}from"react";import{Orientation}from"../constants.js";import HostContext from"../hostContext.js";import{makeSafeClassName,inspectItems}from"../utils.js";import FormElement from"./FormElement.js";import Markdown from"./Markdown.js";import{useFocusCallback}from"./common.js";const StyledFormElement=styled(FormElement)(({theme:{spacing:e}})=>({marginBottom:e(1.5)})),RadioGroup=({className:e,current:t,element:o,enabled:a,id:r,items:m,label:l,name:n,orientation:s,raiseEvent:i,setProperty:c,setValue:u,value:d})=>{const p=useContext(HostContext),f=inspectItems(t,m,d);var v=f.items;const R=[];var b=useFocusCallback(a,n,p);useEffect(()=>{t!==f.current&&c("current",f.current),l!==f.label&&c("label",f.label),d!==f.value&&u(f.value,!1)});for(const k in v){const y=v[k];var C=a&&!1!==y.enabled,E=p.renderText(y.tooltip),F=y.styleName?makeSafeClassName(y.styleName):void 0;R.push(React.createElement(FormControlLabel,{className:F,control:React.createElement(Radio,{inputRef:b,onClick:()=>{t!==k&&(c("current",k),y.value!==d?u(y.value,{item:k}):i("changed",y.value,void 0,k))}}),disabled:!C,key:k,label:React.createElement(Markdown,{text:y.label}),title:E,value:k}))}return React.createElement(StyledFormElement,{className:e,component:"fieldset",element:o,name:n},React.createElement(BaseRadioGroup,{name:r,row:s===Orientation.HORIZONTAL,value:t||""},R))};export default RadioGroup;
+import FormControlLabel from"@vertigis/react-ui/FormControlLabel";import Radio from"@vertigis/react-ui/Radio";import BaseRadioGroup from"@vertigis/react-ui/RadioGroup";import{styled}from"@vertigis/react-ui/styles";import*as React from"react";import{useContext,useEffect}from"react";import{Orientation}from"../constants.js";import HostContext from"../hostContext.js";import{makeSafeClassName,inspectItems}from"../utils.js";import FormElement from"./FormElement.js";import Markdown from"./Markdown.js";import{useFocusCallback}from"./common.js";const StyledFormElement=styled(FormElement)(({theme:{spacing:e}})=>({marginBottom:e(1.5)})),RadioGroup=({className:e,current:t,element:o,enabled:r,id:a,items:m,label:l,name:s,orientation:n,raiseEvent:i,setProperty:c,setValue:u,value:p})=>{const d=useContext(HostContext),f=inspectItems(t,m,p);var v=f.items;const R=[];var b=useFocusCallback(r,s,d);useEffect(()=>{t!==f.current&&c("current",f.current),l!==f.label&&c("label",f.label),p!==f.value&&u(f.value,!1)});for(const k in v){const y=v[k];var C=r&&!1!==y.enabled,E=d.renderText(y.tooltip),F=y.styleName?makeSafeClassName(y.styleName):void 0;R.push(React.createElement(FormControlLabel,{className:F,control:React.createElement(Radio,{onClick:()=>{t!==k&&(c("current",k),y.value!==p?u(y.value,{item:k}):i("changed",y.value,void 0,k))},slotProps:{input:{ref:b}}}),disabled:!C,key:k,label:React.createElement(Markdown,{text:y.label}),title:E,value:k}))}return React.createElement(StyledFormElement,{className:e,component:"fieldset",element:o,name:s},React.createElement(BaseRadioGroup,{name:a,row:n===Orientation.HORIZONTAL,value:t||""},R))};export default RadioGroup;

package/forms/components/Scanner.js

@@ -1 +1 @@
-import Button from"@vertigis/react-ui/Button";import Input from"@vertigis/react-ui/Input";import Stack from"@vertigis/react-ui/Stack";import{Close as CloseIcon,ScanBarcode,ScanMulti,ScanQr}from"@vertigis/react-ui/icons";import{styled}from"@vertigis/react-ui/styles";import{useState,useEffect,useRef,useContext}from"react";import*as React from"react";import{ScanType}from"../constants.js";import{scannerConfiguration}from"../elements/Scanner.js";import HostContext from"../hostContext.js";import{getKeyString}from"../keyboard.js";import{isScanRef,makeUniqueId}from"../utils.js";import FormElement from"./FormElement.js";import{useFocusCallback}from"./common.js";const PREFIX="Scanner",scannerClasses={container:`${PREFIX}-container`,button:`${PREFIX}-button`,inputContainer:`${PREFIX}-inner`},StyledFormElement=styled(FormElement)(({theme:{spacing:e}})=>({[`.${scannerClasses.container}`]:{gap:e(.5),video:{width:"100%"},[`.${scannerClasses.inputContainer}`]:{alignItems:"flex-start",gap:e(.5),[`.${scannerClasses.button}`]:{minWidth:0,padding:e(.5)}}}})),CAMERA_READY_TIMEOUT_MS=1500;var EntryMethod;!function(e){e.Camera="camera",e.Manual="manual"}(EntryMethod=EntryMethod||{});const convertToScanRef=(e,t,n)=>{var a=typeof e,a="number"==a||"string"==a?e.toString():e?.value?.toString();if(a)return t=t||e?.entryMethod||EntryMethod.Manual,{refValueType:"scan",value:a,scanType:n=n||e?.scanType,entryMethod:t}},Scanner=({autoActivate:e,className:t,element:n,enabled:a,manualEntry:r,name:o,raiseEvent:c,require:s,scanType:i,setProperty:l,setValue:u,size:m,tooltip:d,value:p})=>{const E=useContext(HostContext),[f,C]=useState(!0),[S,v]=useState(null),[y,g]=useState(""),[R,T]=useState(!1),[M,w]=useState(scannerConfiguration.rows.default),h=useRef(null);var A=`${makeUniqueId(o)}-input`;const I="barcode"!==i;useEffect(()=>{let e=scannerConfiguration.rows.default;"number"==typeof m&&(e=Math.max(scannerConfiguration.rows.minimum,m)),w(e)},[m]),useEffect(()=>(T(!0),()=>T(!1)),[]),useEffect(()=>{R&&a&&e&&(l("autoActivate",!1),x())},[R]),useEffect(()=>{S&&(C(!1),setTimeout(()=>{R&&C(!0)},CAMERA_READY_TIMEOUT_MS))},[S]);var _=useFocusCallback(a,o,E);useEffect(()=>{let e=p;!isScanRef(e)&&e&&(e=convertToScanRef(e),u(e,!1));var t=e?.value||"";y!==t&&g(t)},[p]);var D=E.renderText(d),d=!a,r=d||!r;const F=(e,t,n)=>{e&&p?.value!==e&&(n=convertToScanRef(e,t,n),u(n),g(e))},b=async e=>{var t=(await import("@zxing/browser"))["BarcodeFormat"];let n;return e===ScanType.QrCode?n=[t.AZTEC,t.DATA_MATRIX,t.MAXICODE,t.PDF_417,t.QR_CODE]:e===ScanType.BarCode&&(n=[t.CODABAR,t.CODE_39,t.CODE_93,t.CODE_128,t.EAN_8,t.EAN_13,t.ITF,t.RSS_14,t.RSS_EXPANDED,t.UPC_A,t.UPC_E,t.UPC_EAN_EXTENSION]),n},x=async()=>{if(S)return v(null),void c("cancel",void 0);const{BrowserCodeReader:o,BrowserMultiFormatReader:e}=await import("@zxing/browser");var t;R&&(t=await(async e=>{var t=(await import("@zxing/library"))["DecodeHintType"],e=await b(e);const n=new Map;return n.set(t.POSSIBLE_FORMATS,e),n})(i),t=new e(t),v(t),await(async e=>{try{var t=await o.listVideoInputDevices();if(!t||0==t.length)throw new DOMException("No video input devices detected.");const a=await e.decodeOnceFromVideoDevice(void 0,h.current||void 0),r=await b(ScanType.QrCode);var n=r.indexOf(a.getBarcodeFormat())<0?ScanType.BarCode:ScanType.QrCode;F(a.toString(),EntryMethod.Camera,n),v(null)}catch(e){e instanceof DOMException&&(l("error",e.message),v(null))}})(t))};return React.createElement(StyledFormElement,{className:t,element:n,inputId:A,name:o},React.createElement(Stack,{className:scannerClasses.container},React.createElement("video",{hidden:!S,ref:h}),React.createElement(Stack,{className:scannerClasses.inputContainer,direction:"row"},React.createElement(Input,{disabled:r,fullWidth:!0,id:A,inputProps:{title:D},inputRef:_,multiline:I,onBlur:e=>{0<e.currentTarget.value.length&&(v(null),F(e.currentTarget.value,EntryMethod.Manual))},onChange:e=>{g(e.currentTarget.value)},onKeyDown:e=>{"enter"===getKeyString(e)&&e.stopPropagation(),I||(e=e.currentTarget,v(null),F(e.value,EntryMethod.Manual))},required:s,rows:I?M:void 0,spellCheck:!1,value:y}),React.createElement(Button,{className:scannerClasses.button,color:"primary",disabled:d||!f,onClick:x,ref:_,title:D},S?React.createElement(CloseIcon,null):i===ScanType.BarCode?React.createElement(ScanBarcode,null):i===ScanType.QrCode?React.createElement(ScanQr,null):React.createElement(ScanMulti,null)))))};export default Scanner;export{scannerClasses};
+import Button from"@vertigis/react-ui/Button";import Input from"@vertigis/react-ui/Input";import Stack from"@vertigis/react-ui/Stack";import{Close as CloseIcon,ScanBarcode,ScanMulti,ScanQr}from"@vertigis/react-ui/icons";import{styled}from"@vertigis/react-ui/styles";import{useState,useEffect,useRef,useContext}from"react";import*as React from"react";import{ScanType}from"../constants.js";import{scannerConfiguration}from"../elements/Scanner.js";import HostContext from"../hostContext.js";import{isScanRef,makeUniqueId}from"../utils.js";import FormElement from"./FormElement.js";import{useFocusCallback}from"./common.js";const PREFIX="Scanner",scannerClasses={container:`${PREFIX}-container`,button:`${PREFIX}-button`,inputContainer:`${PREFIX}-inner`},StyledFormElement=styled(FormElement)(({theme:{spacing:e}})=>({[`.${scannerClasses.container}`]:{gap:e(.5),video:{width:"100%"},[`.${scannerClasses.inputContainer}`]:{alignItems:"flex-start",gap:e(.5),[`.${scannerClasses.button}`]:{minWidth:0,padding:e(.5)}}}})),CAMERA_READY_TIMEOUT_MS=1500;var EntryMethod;!function(e){e.Camera="camera",e.Manual="manual"}(EntryMethod=EntryMethod||{});const convertToScanRef=(e,t,a)=>{var n=typeof e,n="number"==n||"string"==n?e.toString():e?.value?.toString();if(n)return t=t||e?.entryMethod||EntryMethod.Manual,{refValueType:"scan",value:n,scanType:a=a||e?.scanType,entryMethod:t}},Scanner=({autoActivate:e,className:t,element:a,enabled:n,manualEntry:r,name:o,raiseEvent:c,require:s,scanType:i,setProperty:l,setValue:u,size:m,tooltip:d,value:p})=>{const E=useContext(HostContext),[f,C]=useState(!0),[S,v]=useState(null),[y,R]=useState(""),[T,g]=useState(!1),[M,w]=useState(scannerConfiguration.rows.default),h=useRef(null);var A=`${makeUniqueId(o)}-input`;const I="barcode"!==i;useEffect(()=>{let e=scannerConfiguration.rows.default;"number"==typeof m&&(e=Math.max(scannerConfiguration.rows.minimum,m)),w(e)},[m]),useEffect(()=>(g(!0),()=>g(!1)),[]),useEffect(()=>{T&&n&&e&&(l("autoActivate",!1),b())},[T]),useEffect(()=>{S&&(C(!1),setTimeout(()=>{T&&C(!0)},CAMERA_READY_TIMEOUT_MS))},[S]);var _=useFocusCallback(n,o,E);useEffect(()=>{let e=p;!isScanRef(e)&&e&&(e=convertToScanRef(e),u(e,!1));var t=e?.value||"";y!==t&&R(t)},[p]);var D=E.renderText(d),d=!n,r=d||!r;const F=(e,t,a)=>{e&&p?.value!==e&&(a=convertToScanRef(e,t,a),u(a),R(e))},x=async e=>{var t=(await import("@zxing/browser"))["BarcodeFormat"];let a;return e===ScanType.QrCode?a=[t.AZTEC,t.DATA_MATRIX,t.MAXICODE,t.PDF_417,t.QR_CODE]:e===ScanType.BarCode&&(a=[t.CODABAR,t.CODE_39,t.CODE_93,t.CODE_128,t.EAN_8,t.EAN_13,t.ITF,t.RSS_14,t.RSS_EXPANDED,t.UPC_A,t.UPC_E,t.UPC_EAN_EXTENSION]),a},b=async()=>{if(S)return v(null),void c("cancel",void 0);const{BrowserCodeReader:o,BrowserMultiFormatReader:e}=await import("@zxing/browser");var t;T&&(t=await(async e=>{var t=(await import("@zxing/library"))["DecodeHintType"],e=await x(e);const a=new Map;return a.set(t.POSSIBLE_FORMATS,e),a})(i),t=new e(t),v(t),await(async e=>{try{var t=await o.listVideoInputDevices();if(!t||0==t.length)throw new DOMException("No video input devices detected.");const n=await e.decodeOnceFromVideoDevice(void 0,h.current||void 0),r=await x(ScanType.QrCode);var a=r.indexOf(n.getBarcodeFormat())<0?ScanType.BarCode:ScanType.QrCode;F(n.toString(),EntryMethod.Camera,a),v(null)}catch(e){e instanceof DOMException&&(l("error",e.message),v(null))}})(t))};return React.createElement(StyledFormElement,{className:t,element:a,inputId:A,name:o},React.createElement(Stack,{className:scannerClasses.container},React.createElement("video",{hidden:!S,ref:h}),React.createElement(Stack,{className:scannerClasses.inputContainer,direction:"row"},React.createElement(Input,{disabled:r,fullWidth:!0,id:A,inputProps:{title:D},inputRef:_,multiline:I,onBlur:e=>{0<e.currentTarget.value.length&&(v(null),F(e.currentTarget.value,EntryMethod.Manual))},onChange:e=>{R(e.currentTarget.value)},onKeyDown:e=>{I||(e=e.currentTarget,v(null),F(e.value,EntryMethod.Manual))},required:s,rows:I?M:void 0,spellCheck:!1,value:y}),React.createElement(Button,{className:scannerClasses.button,color:"primary",disabled:d||!f,onClick:b,ref:_,title:D},S?React.createElement(CloseIcon,null):i===ScanType.BarCode?React.createElement(ScanBarcode,null):i===ScanType.QrCode?React.createElement(ScanQr,null):React.createElement(ScanMulti,null)))))};export default Scanner;export{scannerClasses};

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{useContext,useEffect}from"react";import{defs}from"../FormHost.js";import HostContext from"../hostContext.js";import{getLabelId,isAccordionSection,isCollapsibleSection,isFieldsetSection,isTabSection,makeSafeClassName,makeUniqueId}from"../utils.js";import Markdown from"./Markdown.js";import{renderAccessibleDescription,renderDescription,renderError,useFocusCallback}from"./common.js";const PREFIX="WorkflowSection",sectionClasses={root:`${PREFIX}-root`,basicSection:`${PREFIX}-basicSection`,fieldSetSection:`${PREFIX}-fieldSetSection`,tabSection:`${PREFIX}-tabSetSection`,title:`${PREFIX}-title`,unstyledSection:`${PREFIX}-unstyledSection`,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}}})=>({margin:`${t(4)} 0 ${t(4)} 0`,[`.${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",padding:`${t(3)} 0 ${t(2)} 0`,[`.${sectionClasses.title}`]:{backgroundColor:e.background.default,position:"absolute",top:o(-22),left:0,padding:0,"& span":{paddingRight:t(1)}}},[`&.${sectionClasses.unstyledSection}`]:{marginBottom:0,marginTop:0}})),Section=({accessibleDescription:e,className:t,collapsed:o,component:i,description:s,element:n,enabled:r,error:a,name:c,setProperty:l})=>{const d=useContext(HostContext);let m;null!=n&&n.format&&(m=n.format),m=void 0!==m&&null!==m?m:defs.DEFAULT_SECTION_FORMAT;const p=isAccordionSection(n);var S=isFieldsetSection(n),f=isTabSection(n);const b=p||f||isCollapsibleSection(n);var u=`${makeUniqueId(c)}-input`,g=useFocusCallback(r,c,d);useEffect(()=>(d.refs[c]=i,()=>{d.refs[c]=void 0}),[]);var C,y,E,$=(C=n,y=u,E=S?"legend":void 0,React.createElement(FormLabel,{className:sectionClasses.title,error:b&&(d.hasInvalidChild(C)||!!a),id:getLabelId(y),component:E||"h6"},React.createElement(Markdown,{inline:!0,text:C.title}))),r=renderDescription(s,u,r,sectionClasses.description),e=renderAccessibleDescription(e,s,u,d),s=renderError(a),u={"aria-labelledby":$?.props?.id,"aria-details":r?.props?.id,"aria-describedby":e?.props?.id},s=[r,e,s,i.props.children],n=clsx(t,n.type,sectionClasses.root,{[sectionClasses.basicSection]:"basic-section"===m,[sectionClasses.fieldSetSection]:"fieldset-section"===m,[sectionClasses.tabSection]:"tab-section"===m,[sectionClasses.unstyledSection]:"unstyled-section"===m,[makeSafeClassName(c)]:!!c,[makeSafeClassName(n.styleName)]:!!n.styleName});if(f)return React.createElement(StyledTabPage,{"aria-labelledby":`simple-tab-${c}`,className:n,hidden:o,id:`simple-tabpanel-${c}`,role:"tabpanel"},...s);if(b)return React.createElement(StyledAccordion,{className:n,expanded:!0!==o,onChange:(e,t)=>{p&&t?d.updateMutuallyExclusiveSections(c):l("collapsed",!t)},...u},React.createElement(AccordionSummary,{expandIcon:React.createElement(ChevronDown,null),ref:g},$),...s);{const i=S?"fieldset":"section";return React.createElement(StyledSection,{className:n,component:i,...u},$,React.createElement(Box,null,...s))}};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{useContext,useEffect}from"react";import{defs}from"../FormHost.js";import HostContext from"../hostContext.js";import{getLabelId,isAccordionSection,isCollapsibleSection,isFieldsetSection,isTabSection,makeSafeClassName,makeUniqueId}from"../utils.js";import Markdown from"./Markdown.js";import{renderAccessibleDescription,renderDescription,renderError,useFocusCallback}from"./common.js";const PREFIX="WorkflowSection",sectionClasses={root:`${PREFIX}-root`,basicSection:`${PREFIX}-basicSection`,fieldSetSection:`${PREFIX}-fieldSetSection`,tabSection:`${PREFIX}-tabSetSection`,title:`${PREFIX}-title`,unstyledSection:`${PREFIX}-unstyledSection`,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("div")(({theme:{palette:e,spacing:t,typography:{pxToRem:o}}})=>({margin:`${t(4)} 0 ${t(4)} 0`,[`.${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",padding:`${t(3)} 0 ${t(2)} 0`,[`.${sectionClasses.title}`]:{backgroundColor:e.background.default,position:"absolute",top:o(-22),left:0,padding:0,"& span":{paddingRight:t(1)}}},[`&.${sectionClasses.unstyledSection}`]:{marginBottom:0,marginTop:0}})),Section=({accessibleDescription:e,className:t,collapsed:o,component:i,description:s,element:n,enabled:r,error:a,name:c,setProperty:l})=>{const d=useContext(HostContext);let m;null!=n&&n.format&&(m=n.format),m=void 0!==m&&null!==m?m:defs.DEFAULT_SECTION_FORMAT;const p=isAccordionSection(n);var S=isFieldsetSection(n),f=isTabSection(n);const b=p||f||isCollapsibleSection(n);var u=`${makeUniqueId(c)}-input`,g=useFocusCallback(r,c,d);useEffect(()=>(d.refs[c]=i,()=>{d.refs[c]=void 0}),[]);var C,y,E,$=(C=n,y=u,E=S?"legend":void 0,React.createElement(FormLabel,{className:sectionClasses.title,error:b&&(d.hasInvalidChild(C)||!!a),id:getLabelId(y),component:E||"h6"},React.createElement(Markdown,{inline:!0,text:C.title}))),r=renderDescription(s,u,r,sectionClasses.description),e=renderAccessibleDescription(e,s,u,d),s=renderError(a),u={"aria-labelledby":$?.props?.id,"aria-details":r?.props?.id,"aria-describedby":e?.props?.id},s=[r,e,s,i.props.children],n=clsx(t,n.type,sectionClasses.root,{[sectionClasses.basicSection]:"basic-section"===m,[sectionClasses.fieldSetSection]:"fieldset-section"===m,[sectionClasses.tabSection]:"tab-section"===m,[sectionClasses.unstyledSection]:"unstyled-section"===m,[makeSafeClassName(c)]:!!c,[makeSafeClassName(n.styleName)]:!!n.styleName});if(f)return React.createElement(StyledTabPage,{"aria-labelledby":`simple-tab-${c}`,className:n,hidden:o,id:`simple-tabpanel-${c}`,role:"tabpanel"},...s);if(b)return React.createElement(StyledAccordion,{className:n,expanded:!0!==o,onChange:(e,t)=>{p&&t?d.updateMutuallyExclusiveSections(c):l("collapsed",!t)},...u},React.createElement(AccordionSummary,{expandIcon:React.createElement(ChevronDown,null),ref:g},$),...s);{const i=S?"fieldset":"section";return React.createElement(StyledSection,{className:n,component:i,...u},$,React.createElement(Box,null,...s))}};export default Section;export{sectionClasses};

package/forms/components/TextBox.js

@@ -1 +1 @@
-import Input from"@vertigis/react-ui/Input";import*as React from"react";import{useContext,useEffect,useState}from"react";import{FormElementTypes}from"../constants.js";import HostContext from"../hostContext.js";import{getKeyString}from"../keyboard.js";import{makeUniqueId}from"../utils.js";import FormElement from"./FormElement.js";import{useFocusCallback}from"./common.js";const TextBox=({className:e,element:t,enabled:r,type:o,maxLength:n,name:a,prompt:m,readOnly:s,require:u,tooltip:l,value:i,setValue:p})=>{const c=useContext(HostContext),[f,d]=useState(""),g=`${makeUniqueId(a)}-input`,x=o===FormElementTypes.PASSWORDBOX,v=x?void 0:n,y=c.renderText(m),E=x?void 0:s,C=c.renderText(l);useEffect(()=>{let e="";"string"==typeof i?e=i:"number"!=typeof i||x||(e=c.formatNumber(i)),i!==e&&p(e,!1),f!==e&&d(e)},[i]);const T=e=>{p(e),d(e)},b=e=>{e=e.target.value;e!=i&&T(e)},F=e=>{e=e.target.value;e!=f&&d(e)},h=e=>{var t=getKeyString(e);return"enter"===t?(e=>{const t=e.currentTarget;var r=t.value;if(r!==i)return T(r),t.select(),e.stopPropagation(),e.preventDefault(),!1})(e):"escape"===t?(e=>{const t=e.currentTarget;if(t.value!==i)return d(i||""),t.select(),e.stopPropagation(),e.preventDefault(),!1})(e):void 0},j=useFocusCallback(r,a,c);return React.createElement(FormElement,{className:e,element:t,inputId:g,name:a},e=>React.createElement(Input,{disabled:!r,fullWidth:!0,id:g,inputProps:{...e,maxLength:v,onKeyDown:h,title:C},inputRef:j,onBlur:b,onChange:F,placeholder:y,readOnly:E,required:u,type:x?"password":"text",value:f}))};export default TextBox;
+import Input from"@vertigis/react-ui/Input";import*as React from"react";import{useContext,useEffect,useState}from"react";import{FormElementTypes}from"../constants.js";import HostContext from"../hostContext.js";import{getKeyString}from"../keyboard.js";import{makeUniqueId}from"../utils.js";import FormElement from"./FormElement.js";import{useFocusCallback}from"./common.js";const TextBox=({className:e,element:t,enabled:r,type:o,maxLength:n,name:a,prompt:m,readOnly:s,require:u,tooltip:l,value:i,setValue:p})=>{const c=useContext(HostContext),[f,d]=useState(""),x=`${makeUniqueId(a)}-input`,g=o===FormElementTypes.PASSWORDBOX,v=g?void 0:n,y=c.renderText(m),E=g?void 0:s,C=c.renderText(l);useEffect(()=>{let e="";"string"==typeof i?e=i:"number"!=typeof i||g||(e=c.formatNumber(i)),i!==e&&p(e,!1),f!==e&&d(e)},[i]);const T=e=>{p(e),d(e)},b=e=>{e=e.target.value;e!=i&&T(e)},F=e=>{e=e.target.value;e!=f&&d(e)},h=e=>{var t=getKeyString(e);return"enter"===t?(e=>{e=e.currentTarget.value;e!==i&&T(e)})(e):"escape"===t?(e=>{const t=e.currentTarget;if(t.value!==i)return d(i||""),t.select(),e.stopPropagation(),e.preventDefault(),!1})(e):void 0},j=useFocusCallback(r,a,c);return React.createElement(FormElement,{className:e,element:t,inputId:x,name:a},e=>React.createElement(Input,{disabled:!r,fullWidth:!0,id:x,inputProps:{...e,maxLength:v,onKeyDown:h,title:C},inputRef:j,onBlur:b,onChange:F,placeholder:y,readOnly:E,required:u,type:g?"password":"text",value:f}))};export default TextBox;

package/forms/components/TimePicker.js

@@ -1 +1 @@
-import{buttonBaseClasses}from"@vertigis/react-ui/ButtonBase";import FormHelperText from"@vertigis/react-ui/FormHelperText";import{clockClasses}from"@vertigis/react-ui/TimeClock";import BaseTimePicker from"@vertigis/react-ui/TimePicker";import{styled}from"@vertigis/react-ui/styles";import*as React from"react";import{useContext,useEffect,useMemo,useRef,useState}from"react";import{Calendar}from"../Calendar.js";import{areValuesEqual,getDateBounds,getNewElementValue,makeProperValue}from"../dateUtilities.js";import HostContext from"../hostContext.js";import{isInvalidError}from"../textUtilities.js";import{makeUniqueId,useLocale}from"../utils.js";import DateTimeTextField from"./DateTimeTextField.js";import FormElement from"./FormElement.js";import{useFocusCallback}from"./common.js";const StylableTimePicker=e=>{let{className:t,slotProps:r,...o}=e;return r=r||{},React.createElement(BaseTimePicker,{slotProps:{...r,popper:{...r.popper,className:t}},...o})},StyledTimePicker=styled(StylableTimePicker)(({theme:{palette:e}})=>({[`& .${clockClasses.amButton}, .${clockClasses.pmButton}`]:{[`&.${buttonBaseClasses.focusVisible}`]:{color:e.action.active}}})),TimePicker=({className:e,element:t,enabled:r,error:o,format:a,name:s,prompt:i,setProperty:l,setValue:m,tooltip:n,value:u})=>{const c=useContext(HostContext),[p,d]=useState(!1),[f,T]=useState(!1),[k,E]=useState(!1),[x,v]=useState(null),C=useRef();const F={locale:useLocale(),timezone:(new Intl.DateTimeFormat).resolvedOptions().timeZone},P=useRef(!0),g=useFocusCallback(r,s,c),B=c.renderText(n),R=Calendar.useNative(),S="time",V=isInvalidError(o);useEffect(()=>{var e=makeProperValue(u,R),t=getNewElementValue(e,S,F,R);areValuesEqual(u,t)||m(t,!1),v(e||null)},[u]),useEffect(()=>{if(!k&&!f)if(p)V||l("error",{status:"invalid"});else{if(V&&l("error",void 0),P.current)return void(P.current=!1);var e=getNewElementValue(x,S,F,R);areValuesEqual(u,e)||m(e)}P.current=!1},[p,f,k]);const{min:b,max:y}=getDateBounds(a),j=useMemo(()=>`${makeUniqueId(s)}-input`,[s]),N=c.renderText(i);return React.createElement(FormElement,{className:e,element:t,inputId:j,name:s},e=>React.createElement(React.Fragment,null,V&&React.createElement(FormHelperText,{component:"div",error:!0,role:"alert"},C.current),React.createElement(StyledTimePicker,{disabled:!r,inputRef:e=>{e&&(C.current=e.dataset.formatString,g(e))},key:"date-picker",maxTime:y,minTime:b,onChange:e=>v(e),onClose:()=>E(!1),onError:e=>d(!!e),onOpen:()=>E(!0),slots:{textField:DateTimeTextField},slotProps:{textField:{error:!!o,id:j,inputProps:{...e,placeholder:N},onBlur:()=>T(!1),onFocus:()=>T(!0),title:B}},value:x})))};export default TimePicker;
+import{buttonBaseClasses}from"@vertigis/react-ui/ButtonBase";import FormHelperText from"@vertigis/react-ui/FormHelperText";import{clockClasses}from"@vertigis/react-ui/TimeClock";import BaseTimePicker from"@vertigis/react-ui/TimePicker";import{styled}from"@vertigis/react-ui/styles";import*as React from"react";import{useContext,useEffect,useMemo,useRef,useState}from"react";import{Calendar}from"../Calendar.js";import{areValuesEqual,getDateBounds,getNewElementValue,makeProperValue}from"../dateUtilities.js";import HostContext from"../hostContext.js";import{isInvalidError}from"../textUtilities.js";import{makeUniqueId,useLocale}from"../utils.js";import DateTimeTextField from"./DateTimeTextField.js";import FormElement from"./FormElement.js";import{useFocusCallback}from"./common.js";const StylableTimePicker=e=>{const{className:t,slotProps:r,...o}=e;return React.createElement(BaseTimePicker,{slotProps:{...r,popper:{...r?.popper,className:t}},...o})},StyledTimePicker=styled(StylableTimePicker)(({theme:{palette:e}})=>({[`& .${clockClasses.amButton}, .${clockClasses.pmButton}`]:{[`&.${buttonBaseClasses.focusVisible}`]:{color:e.action.active}}})),TimePicker=({className:e,element:t,enabled:r,error:o,format:a,name:s,prompt:i,setProperty:l,setValue:m,tooltip:n,value:u})=>{const c=useContext(HostContext),[p,d]=useState(!1),[f,T]=useState(!1),[k,E]=useState(!1),[x,v]=useState(null),C=useRef();const F={locale:useLocale(),timezone:(new Intl.DateTimeFormat).resolvedOptions().timeZone},P=useRef(!0),g=useFocusCallback(r,s,c),B=c.renderText(n),R=Calendar.useNative(),S="time",V=isInvalidError(o);useEffect(()=>{var e=makeProperValue(u,R),t=getNewElementValue(e,S,F,R);areValuesEqual(u,t)||m(t,!1),v(e||null)},[u]),useEffect(()=>{if(!k&&!f)if(p)V||l("error",{status:"invalid"});else{if(V&&l("error",void 0),P.current)return void(P.current=!1);var e=getNewElementValue(x,S,F,R);areValuesEqual(u,e)||m(e)}P.current=!1},[p,f,k]);const{min:b,max:y}=getDateBounds(a),j=useMemo(()=>`${makeUniqueId(s)}-input`,[s]),N=c.renderText(i);return React.createElement(FormElement,{className:e,element:t,inputId:j,name:s},e=>React.createElement(React.Fragment,null,V&&React.createElement(FormHelperText,{component:"div",error:!0,role:"alert"},C.current),React.createElement(StyledTimePicker,{disabled:!r,inputRef:e=>{e&&(C.current=e.dataset.formatString,g(e))},key:"date-picker",maxTime:y,minTime:b,onChange:e=>v(e),onClose:()=>E(!1),onError:e=>d(!!e),onOpen:()=>E(!0),slots:{textField:DateTimeTextField},slotProps:{textField:{error:!!o,id:j,inputProps:{...e,placeholder:N},onBlur:()=>T(!1),onFocus:()=>T(!0),title:B}},value:x})))};export default TimePicker;

package/forms/customNumberFormat.js

@@ -1 +1 @@
-import{DEFAULT_LOCALE}from"../constants.js";import{getPercentSymbolInfo,preciseRound}from"./numberUtilities.js";const CustomSpecifiers={Comma:",",DecimalPoint:".",Hash:"#",Percent:"%",Permille:"‰",Semicolon:";",Zero:"0"};function countDecimalsInCustomFormat(e,t){if(!e)return 0;const r=inspectCustomFormat(e=chooseCustomFormatSection(e.split(CustomSpecifiers.Semicolon),t))["parts"];return r.some(e=>"exponentSeparator"===e.type)?void 0:r.some(e=>"decimal"===e.type)?r.filter(e=>"fraction"===e.type).length+2*r.filter(e=>"percentSign"===e.type).length+3*r.filter(e=>"permilleSign"===e.type).length:0}function inspectCustomFormat(e){const t=[];let r=!1,n=!1,i=!1,a=!1;const o=/,|0|#|%|‰|[Ee]|[+-]|\.|\\.|(["'])[^\1]+\1|[^,0#%‰Ee+-\.\\"'+]+/g;for(var l;null!==(l=o.exec(e));){const g=l[0];switch(g){case CustomSpecifiers.Comma:!a||r||n||t.push({type:"group",value:CustomSpecifiers.Comma});break;case CustomSpecifiers.DecimalPoint:r||(t.push({type:"decimal",value:CustomSpecifiers.DecimalPoint}),r=!0);break;case CustomSpecifiers.Hash:n?t.push({type:"exponentInteger",value:CustomSpecifiers.Hash}):r?t.push({type:"fraction",value:CustomSpecifiers.Hash}):(t.push({type:"integer",value:CustomSpecifiers.Hash}),a=!0);break;case CustomSpecifiers.Percent:t.push({type:"percentSign",value:CustomSpecifiers.Percent});break;case CustomSpecifiers.Permille:t.push({type:"permilleSign",value:CustomSpecifiers.Permille});break;case CustomSpecifiers.Zero:n?t.push({type:"exponentInteger",value:CustomSpecifiers.Zero}):r?t.push({required:!0,type:"fraction",value:CustomSpecifiers.Zero}):(t.push({required:!0,type:"integer",value:CustomSpecifiers.Zero}),a=!0);break;case"E":case"e":n?t.push({type:"literal",value:g}):(t.push({type:"exponentSeparator",value:g}),n=!0);break;case"+":n&&!i?(t.push({type:"exponentPlusSign",value:g}),i=!0):t.push({type:"literal",value:g});break;case"-":n&&!i?(t.push({type:"exponentMinusSign",value:g}),i=!0):t.push({type:"literal",value:g});break;default:g.startsWith("\\")?t.push({type:"literal",value:g[1]}):g.startsWith('"')||g.startsWith("'")?t.push({type:"literal",value:g.substring(1,g.length-1)}):t.push({type:"literal",value:g})}}let u=1;var p=t.findLastIndex(e=>"integer"===e.type);if(-1!==p)for(var s=p+1;"group"===t[s]?.type;)u/=1e3,t.splice(s,1);p=t.some(e=>"group"===e.type);let m=t.findIndex(e=>"group"===e.type);for(;-1!==m;)t.splice(m,1),m=t.findIndex(e=>"group"===e.type);var c=t.filter(e=>"percentSign"===e.type).length;for(let e=0;e<c;e++)u*=100;var f=t.filter(e=>"permilleSign"===e.type).length;for(let e=0;e<f;e++)u*=1e3;return{multiplier:u,parts:t,useGrouping:p}}function chooseCustomFormatSection(e,t){var[r,n,i]=e;if(void 0===t)return r;switch(e.length){case 3:if(0===t)return i;case 2:if(t<0&&n)return n;default:return r}}function customFormatNumber(t,e,r=DEFAULT_LOCALE){if(!e){const b=new Intl.NumberFormat(r);return b.format(t)}var n=e.split(CustomSpecifiers.Semicolon),i=(e=chooseCustomFormatSection(n,t))===n[0]&&t<0;const{multiplier:a,parts:o,useGrouping:l}=inspectCustomFormat(e),u={minimumFractionDigits:0,maximumFractionDigits:0};t*=a;var p=o.filter(e=>"fraction"===e.type&&!e.required).length,s=o.filter(e=>"fraction"===e.type&&e.required).length,n=s+p+2*o.filter(e=>"percentSign"===e.type).length+3*o.filter(e=>"permilleSign"===e.type).length;let m=[];var c=t=>{for(let e=t.length-1;0<=e;e--)if(""===t[e].value||0===e)return t[e]};if(o.some(e=>"exponentSeparator"===e.type)){const E=o.filter(e=>"integer"===e.type);var f,e=E.findIndex(e=>"integer"===e.type&&e.required),p=E.findIndex(e=>"integer"===e.type&&!e.required),e=-1===e?0:E.length-e,g=-1===p?e:Math.max(e,E.length-p);if(g<=1)m=new Intl.NumberFormat(r,{maximumFractionDigits:n,minimumFractionDigits:s,notation:"scientific",useGrouping:!1}).formatToParts(t);else{const _=new Intl.NumberFormat(r,{maximumFractionDigits:20,minimumFractionDigits:1,minimumIntegerDigits:1,useGrouping:!1});m=_.formatToParts(t);const T=m.find(e=>"integer"===e.type),P=m.find(e=>"fraction"===e.type);let e=0;for(;T.value.length>g;){var v=T.value[T.value.length-1];P.value=v+P.value,T.value=T.value.substring(0,T.value.length-1),e++}for(;"0"===T.value||T.value.length<g;)0===P.value.length?T.value=T.value.padStart(g,"0"):(f=P.value[0],"0"===T.value?T.value=f:T.value+=f,P.value=P.value.substring(1),e--);var y=preciseRound(parseFloat(m.map(e=>e.value).join("")),n);m=_.formatToParts(y),m.push({type:"exponentSeparator",value:"E"}),e<0&&m.push({type:"exponentMinusSign",value:"-"}),m.push({type:"exponentInteger",value:Math.abs(e).toString()})}const R=o.find(e=>"exponentMinusSign"===e.type||"exponentPlusSign"===e.type);p="+"===R?.value?"always":"negativeOnly",y=m.some(e=>"exponentMinusSign"===e.type);"always"==p&&y?R.value="-":"negativeOnly"==p&&(y?R||(y=o.findIndex(e=>"exponentSeparator"===e.type)+1,o.splice(y,0,{type:"exponentMinusSign",value:"-"})):R&&(R.value="")),o.filter(e=>"exponentInteger"===e.type).forEach(e=>e.value="");var h=m.find(e=>"exponentInteger"===e.type)?.value.split("")||[],C=o.filter(e=>"exponentInteger"===e.type);for(let e=h.length-1;0<=e;e--){const L=c(C);if(!L)break;L.value=h[e]+L.value}o.filter(e=>"exponentInteger"===e.type&&""===e.value).forEach(e=>e.value="0")}else{(0<s||0<n)&&(u.minimumFractionDigits=s,u.maximumFractionDigits=n);const D=new Intl.NumberFormat(r,u);m=D.formatToParts(t)}o.filter(e=>"integer"===e.type||"fraction"===e.type).forEach(e=>e.value="");var S=m.filter(e=>"integer"===e.type).map(e=>e.value.split("")).flat();if(1<S.length||"0"!==S[0]){var I=o.filter(e=>"integer"===e.type);for(let e=S.length-1;0<=e;e--){const H=c(I);if(!H)break;H.value=S[e]+H.value}}var d=m.filter(e=>"fraction"===e.type).map(e=>e.value.split("")).flat();const A=o.filter(e=>"fraction"===e.type);for(let e=0;e<d.length;e++){const M=(()=>{for(let e=0;e<A.length;e++)if(""===A[e].value)return A[e]})();if(!M)break;M.value=d[e]}if(o.filter(e=>e.required&&""===e.value).forEach(e=>e.value="0"),l){for(let t=0;t<o.length;t++){const V=o[t];if("integer"===V.type&&1<V.value.length){var N=V.type,x=V.value.split("");o[t]={type:N,value:x[0]};for(let e=1;e<x.length;e++)o.splice(t+e,0,{type:N,value:x[e]})}}let e=o.findLastIndex(e=>"integer"===e.type);for(;1<=e;){var F=e-2;if("integer"!==o[F-1]?.type)break;o.splice(F,0,{type:"group",value:","}),e=F-1}}if(r!==DEFAULT_LOCALE){const{decimalChar:k,groupChar:w}=getNumberFormatChars(r);k!==INVARIANT_DECIMAL_CHAR&&o.filter(e=>"decimal"===e.type).forEach(e=>e.value=k),w!==INVARIANT_GROUP_CHAR&&o.filter(e=>"group"===e.type).forEach(e=>e.value=w);const O=getPercentSymbolInfo(r)?.symbol||INVARIANT_PERCENT_CHAR;O!==INVARIANT_PERCENT_CHAR&&o.filter(e=>"percentSign"===e.type).forEach(e=>e.value=O)}return!i||-1!==(i=o.findIndex(e=>"integer"===e.type))&&o.splice(i,0,{type:"minusSign",value:"-"}),o.map(e=>e.value).join("")}const INVARIANT_DECIMAL_CHAR=".",INVARIANT_GROUP_CHAR=",",INVARIANT_LOCALE="en-US",INVARIANT_MINUS_SIGN="-",INVARIANT_PERCENT_CHAR="%";function getNumberFormatChars(e){let t=INVARIANT_DECIMAL_CHAR,r=INVARIANT_GROUP_CHAR;const n=new Intl.NumberFormat(e),i=n.formatToParts(1234.5);e=i.find(e=>"group"===e.type);e&&(r=e.value);e=i.find(e=>"decimal"===e.type);return e&&(t=e.value),{groupChar:r,decimalChar:t}}function parseCustomFormattedNumberToParts(e,t=DEFAULT_LOCALE){var{groupChar:r,decimalChar:n}=getNumberFormatChars(t),t=getPercentSymbolInfo(t)?.symbol||INVARIANT_PERCENT_CHAR;const i=[];let a={},o;const l=[n,r,t];var u=e=>{i.push(e),a[e.type]=!0},p={exponentInteger:!0,fraction:!0,integer:!0};for(const m of e){let e=o?.type||"unknown";var s=/[0-9\u0660-\u0669\u06f0-\u06f9]/.test(m);l.includes(m)?(e=m===n?"decimal":m===r?"group":"percentSign",o={type:e,value:m},u(o)):"‰"!==m?"e"!==m.toLowerCase()?"-"!==m.toLocaleLowerCase()?s?o?e in p?o.value+=m:(e=a.decimal?a.fraction?"exponentInteger":"fraction":"integer",o={type:e,value:m},u(o)):(o={type:"integer",value:m},u(o)):"literal"==o?.type?o.value+=m:(o={type:"literal",value:m},u(o)):(e=a.integer||a.decimal?a.exponentSeparator?"exponentMinusSign":"literal":"minusSign",o={type:e,value:m},u(o)):(o={type:"exponentSeparator",value:m},u(o)):(u({type:"literal",value:m}),o=void 0)}return i}function parseCustomFormattedNumber(e,t,r=DEFAULT_LOCALE){let n=parseCustomFormattedNumberToParts(e,r);const i=t.split(CustomSpecifiers.Semicolon),a=i.map(e=>inspectCustomFormat(e));var o=a.map(e=>e.parts.filter(e=>"percentSign"===e.type).length),l=a.map(e=>e.parts.filter(e=>"permilleSign"===e.type).length);const u=["group","literal","percentSign"];n=n.filter(e=>!u.includes(e.type)),r!=INVARIANT_LOCALE&&(n.filter(e=>"decimal"===e.type).forEach(e=>e.value=INVARIANT_DECIMAL_CHAR),n.filter(e=>"minusSign"===e.type||"exponentMinusSign"===e.type).forEach(e=>e.value=INVARIANT_MINUS_SIGN),n.filter(e=>"integer"===e.type||"fraction"===e.type||"exponentInteger"===e.type).forEach(e=>e.value=e.value.replaceAll(/[\u0660-\u0669\u06f0-\u06f9]/g,e=>(15&e.charCodeAt(0)).toString())));t=n.map(e=>e.value).join("");let p=parseFloat(t);if(0===p)return p;let s=n.filter(e=>"fraction"===e.type).map(e=>e.value).join("").length;!n.some(e=>"exponentMinusSign"===e.type)||(m=n.find(e=>"exponentInteger"===e.type))&&(c=parseInt(m.value),s+=c);var m=i[1];if(m){const f=a[1]["multiplier"];var c=p;c/=f;const g=s+2*o[1]+3*l[1];if(customFormatNumber(c=preciseRound(p,g),m,r)===e)return c<0?c:-c}const f=a[0]["multiplier"];p/=f;const g=s+2*o[0]+3*l[0];return p=preciseRound(p,g),p}export{countDecimalsInCustomFormat,inspectCustomFormat,customFormatNumber,parseCustomFormattedNumberToParts,parseCustomFormattedNumber};
+import{DEFAULT_LOCALE}from"../constants.js";import{getPercentSymbolInfo,preciseRound}from"./numberUtilities.js";const CustomSpecifiers={Comma:",",DecimalPoint:".",Hash:"#",Percent:"%",Permille:"‰",Semicolon:";",Zero:"0"};function countDecimalsInCustomFormat(e,t){if(!e)return 0;const r=inspectCustomFormat(e=chooseCustomFormatSection(e.split(CustomSpecifiers.Semicolon),t))["parts"];return r.some(e=>"exponentSeparator"===e.type)?void 0:r.some(e=>"decimal"===e.type)?r.filter(e=>"fraction"===e.type).length+2*r.filter(e=>"percentSign"===e.type).length+3*r.filter(e=>"permilleSign"===e.type).length:0}function inspectCustomFormat(e){const t=[];let r=!1,n=!1,i=!1,a=!1;const o=/,|0|#|%|‰|[Ee]|[+-]|\.|\\.|(["'])[^1]+\1|[^,0#%‰Ee+-.\\"'+]+/g;for(var l;null!==(l=o.exec(e));){const g=l[0];switch(g){case CustomSpecifiers.Comma:!a||r||n||t.push({type:"group",value:CustomSpecifiers.Comma});break;case CustomSpecifiers.DecimalPoint:r||(t.push({type:"decimal",value:CustomSpecifiers.DecimalPoint}),r=!0);break;case CustomSpecifiers.Hash:n?t.push({type:"exponentInteger",value:CustomSpecifiers.Hash}):r?t.push({type:"fraction",value:CustomSpecifiers.Hash}):(t.push({type:"integer",value:CustomSpecifiers.Hash}),a=!0);break;case CustomSpecifiers.Percent:t.push({type:"percentSign",value:CustomSpecifiers.Percent});break;case CustomSpecifiers.Permille:t.push({type:"permilleSign",value:CustomSpecifiers.Permille});break;case CustomSpecifiers.Zero:n?t.push({type:"exponentInteger",value:CustomSpecifiers.Zero}):r?t.push({required:!0,type:"fraction",value:CustomSpecifiers.Zero}):(t.push({required:!0,type:"integer",value:CustomSpecifiers.Zero}),a=!0);break;case"E":case"e":n?t.push({type:"literal",value:g}):(t.push({type:"exponentSeparator",value:g}),n=!0);break;case"+":n&&!i?(t.push({type:"exponentPlusSign",value:g}),i=!0):t.push({type:"literal",value:g});break;case"-":n&&!i?(t.push({type:"exponentMinusSign",value:g}),i=!0):t.push({type:"literal",value:g});break;default:g.startsWith("\\")?t.push({type:"literal",value:g[1]}):g.startsWith('"')||g.startsWith("'")?t.push({type:"literal",value:g.substring(1,g.length-1)}):t.push({type:"literal",value:g})}}let u=1;var p=t.findLastIndex(e=>"integer"===e.type);if(-1!==p)for(var s=p+1;"group"===t[s]?.type;)u/=1e3,t.splice(s,1);p=t.some(e=>"group"===e.type);let m=t.findIndex(e=>"group"===e.type);for(;-1!==m;)t.splice(m,1),m=t.findIndex(e=>"group"===e.type);var c=t.filter(e=>"percentSign"===e.type).length;for(let e=0;e<c;e++)u*=100;var f=t.filter(e=>"permilleSign"===e.type).length;for(let e=0;e<f;e++)u*=1e3;return{multiplier:u,parts:t,useGrouping:p}}function chooseCustomFormatSection(e,t){var[r,n,i]=e;if(void 0===t)return r;switch(e.length){case 3:if(0===t)return i;case 2:if(t<0&&n)return n;default:return r}}function customFormatNumber(t,e,r=DEFAULT_LOCALE){if(!e){const b=new Intl.NumberFormat(r);return b.format(t)}var n=e.split(CustomSpecifiers.Semicolon),i=(e=chooseCustomFormatSection(n,t))===n[0]&&t<0;const{multiplier:a,parts:o,useGrouping:l}=inspectCustomFormat(e),u={minimumFractionDigits:0,maximumFractionDigits:0};t*=a;var p=o.filter(e=>"fraction"===e.type&&!e.required).length,s=o.filter(e=>"fraction"===e.type&&e.required).length,n=s+p+2*o.filter(e=>"percentSign"===e.type).length+3*o.filter(e=>"permilleSign"===e.type).length;let m=[];var c=t=>{for(let e=t.length-1;0<=e;e--)if(""===t[e].value||0===e)return t[e]};if(o.some(e=>"exponentSeparator"===e.type)){const E=o.filter(e=>"integer"===e.type);var f,e=E.findIndex(e=>"integer"===e.type&&e.required),p=E.findIndex(e=>"integer"===e.type&&!e.required),e=-1===e?0:E.length-e,g=-1===p?e:Math.max(e,E.length-p);if(g<=1)m=new Intl.NumberFormat(r,{maximumFractionDigits:n,minimumFractionDigits:s,notation:"scientific",useGrouping:!1}).formatToParts(t);else{const _=new Intl.NumberFormat(r,{maximumFractionDigits:20,minimumFractionDigits:1,minimumIntegerDigits:1,useGrouping:!1});m=_.formatToParts(t);const T=m.find(e=>"integer"===e.type),P=m.find(e=>"fraction"===e.type);let e=0;for(;T.value.length>g;){var v=T.value[T.value.length-1];P.value=v+P.value,T.value=T.value.substring(0,T.value.length-1),e++}for(;"0"===T.value||T.value.length<g;)0===P.value.length?T.value=T.value.padStart(g,"0"):(f=P.value[0],"0"===T.value?T.value=f:T.value+=f,P.value=P.value.substring(1),e--);var y=preciseRound(parseFloat(m.map(e=>e.value).join("")),n);m=_.formatToParts(y),m.push({type:"exponentSeparator",value:"E"}),e<0&&m.push({type:"exponentMinusSign",value:"-"}),m.push({type:"exponentInteger",value:Math.abs(e).toString()})}const R=o.find(e=>"exponentMinusSign"===e.type||"exponentPlusSign"===e.type);p="+"===R?.value?"always":"negativeOnly",y=m.some(e=>"exponentMinusSign"===e.type);"always"==p&&y?R.value="-":"negativeOnly"==p&&(y?R||(y=o.findIndex(e=>"exponentSeparator"===e.type)+1,o.splice(y,0,{type:"exponentMinusSign",value:"-"})):R&&(R.value="")),o.filter(e=>"exponentInteger"===e.type).forEach(e=>e.value="");var h=m.find(e=>"exponentInteger"===e.type)?.value.split("")||[],C=o.filter(e=>"exponentInteger"===e.type);for(let e=h.length-1;0<=e;e--){const L=c(C);if(!L)break;L.value=h[e]+L.value}o.filter(e=>"exponentInteger"===e.type&&""===e.value).forEach(e=>e.value="0")}else{(0<s||0<n)&&(u.minimumFractionDigits=s,u.maximumFractionDigits=n);const D=new Intl.NumberFormat(r,u);m=D.formatToParts(t)}o.filter(e=>"integer"===e.type||"fraction"===e.type).forEach(e=>e.value="");var S=m.filter(e=>"integer"===e.type).map(e=>e.value.split("")).flat();if(1<S.length||"0"!==S[0]){var I=o.filter(e=>"integer"===e.type);for(let e=S.length-1;0<=e;e--){const H=c(I);if(!H)break;H.value=S[e]+H.value}}var d=m.filter(e=>"fraction"===e.type).map(e=>e.value.split("")).flat();const A=o.filter(e=>"fraction"===e.type);for(let e=0;e<d.length;e++){const M=(()=>{for(let e=0;e<A.length;e++)if(""===A[e].value)return A[e]})();if(!M)break;M.value=d[e]}if(o.filter(e=>e.required&&""===e.value).forEach(e=>e.value="0"),l){for(let t=0;t<o.length;t++){const V=o[t];if("integer"===V.type&&1<V.value.length){var N=V.type,x=V.value.split("");o[t]={type:N,value:x[0]};for(let e=1;e<x.length;e++)o.splice(t+e,0,{type:N,value:x[e]})}}let e=o.findLastIndex(e=>"integer"===e.type);for(;1<=e;){var F=e-2;if("integer"!==o[F-1]?.type)break;o.splice(F,0,{type:"group",value:","}),e=F-1}}if(r!==DEFAULT_LOCALE){const{decimalChar:k,groupChar:w}=getNumberFormatChars(r);k!==INVARIANT_DECIMAL_CHAR&&o.filter(e=>"decimal"===e.type).forEach(e=>e.value=k),w!==INVARIANT_GROUP_CHAR&&o.filter(e=>"group"===e.type).forEach(e=>e.value=w);const O=getPercentSymbolInfo(r)?.symbol||INVARIANT_PERCENT_CHAR;O!==INVARIANT_PERCENT_CHAR&&o.filter(e=>"percentSign"===e.type).forEach(e=>e.value=O)}return!i||-1!==(i=o.findIndex(e=>"integer"===e.type))&&o.splice(i,0,{type:"minusSign",value:"-"}),o.map(e=>e.value).join("")}const INVARIANT_DECIMAL_CHAR=".",INVARIANT_GROUP_CHAR=",",INVARIANT_LOCALE="en-US",INVARIANT_MINUS_SIGN="-",INVARIANT_PERCENT_CHAR="%";function getNumberFormatChars(e){let t=INVARIANT_DECIMAL_CHAR,r=INVARIANT_GROUP_CHAR;const n=new Intl.NumberFormat(e),i=n.formatToParts(1234.5);e=i.find(e=>"group"===e.type);e&&(r=e.value);e=i.find(e=>"decimal"===e.type);return e&&(t=e.value),{groupChar:r,decimalChar:t}}function parseCustomFormattedNumberToParts(e,t=DEFAULT_LOCALE){var{groupChar:r,decimalChar:n}=getNumberFormatChars(t),t=getPercentSymbolInfo(t)?.symbol||INVARIANT_PERCENT_CHAR;const i=[],a={};let o;const l=[n,r,t];var u=e=>{i.push(e),a[e.type]=!0},p={exponentInteger:!0,fraction:!0,integer:!0};for(const m of e){let e=o?.type||"unknown";var s=/[0-9\u0660-\u0669\u06f0-\u06f9]/.test(m);l.includes(m)?(e=m===n?"decimal":m===r?"group":"percentSign",o={type:e,value:m},u(o)):"‰"!==m?"e"!==m.toLowerCase()?"-"!==m.toLocaleLowerCase()?s?o?e in p?o.value+=m:(e=a.decimal?a.fraction?"exponentInteger":"fraction":"integer",o={type:e,value:m},u(o)):(o={type:"integer",value:m},u(o)):"literal"==o?.type?o.value+=m:(o={type:"literal",value:m},u(o)):(e=a.integer||a.decimal?a.exponentSeparator?"exponentMinusSign":"literal":"minusSign",o={type:e,value:m},u(o)):(o={type:"exponentSeparator",value:m},u(o)):(u({type:"literal",value:m}),o=void 0)}return i}function parseCustomFormattedNumber(e,t,r=DEFAULT_LOCALE){let n=parseCustomFormattedNumberToParts(e,r);const i=t.split(CustomSpecifiers.Semicolon),a=i.map(e=>inspectCustomFormat(e));var o=a.map(e=>e.parts.filter(e=>"percentSign"===e.type).length),l=a.map(e=>e.parts.filter(e=>"permilleSign"===e.type).length);const u=["group","literal","percentSign"];n=n.filter(e=>!u.includes(e.type)),r!=INVARIANT_LOCALE&&(n.filter(e=>"decimal"===e.type).forEach(e=>e.value=INVARIANT_DECIMAL_CHAR),n.filter(e=>"minusSign"===e.type||"exponentMinusSign"===e.type).forEach(e=>e.value=INVARIANT_MINUS_SIGN),n.filter(e=>"integer"===e.type||"fraction"===e.type||"exponentInteger"===e.type).forEach(e=>e.value=e.value.replaceAll(/[\u0660-\u0669\u06f0-\u06f9]/g,e=>(15&e.charCodeAt(0)).toString())));t=n.map(e=>e.value).join("");let p=parseFloat(t);if(0===p)return p;let s=n.filter(e=>"fraction"===e.type).map(e=>e.value).join("").length;!n.some(e=>"exponentMinusSign"===e.type)||(m=n.find(e=>"exponentInteger"===e.type))&&(c=parseInt(m.value),s+=c);var m=i[1];if(m){const f=a[1]["multiplier"];var c=p;c/=f;const g=s+2*o[1]+3*l[1];if(customFormatNumber(c=preciseRound(p,g),m,r)===e)return c<0?c:-c}const f=a[0]["multiplier"];p/=f;const g=s+2*o[0]+3*l[0];return p=preciseRound(p,g),p}export{countDecimalsInCustomFormat,inspectCustomFormat,customFormatNumber,parseCustomFormattedNumberToParts,parseCustomFormattedNumber};

package/forms/index.d.ts

@@ -55,8 +55,7 @@ export interface FormElementProps<TValue = undefined> extends FormElementSettabl
 /**
  * Properties of a Form Element that can be read via the component's properties.
  */
-interface FormElementGettableProps extends Pick<defs.Element, "accessibleDescription" | "autoActivate" | "checked" | "collapsed" | "current" | "customType" | "delay" | "description" | "error" | "fileTypes" | "format" | "itemLabel" | "items" | "label" | "manualEntry" | "maxLength" | "minLength" | "orientation" | "prompt" | "readOnly" | "require" | "scanType" | "selectionMode" | "showFilter" | "showMinMaxLabels" | "showTickMarks" | "size" | "source" | "state" | "title" | "tooltip" | "type" | "wrap"> {
-}
+declare type FormElementGettableProps = Pick<defs.Element, "accessibleDescription" | "autoActivate" | "checked" | "collapsed" | "current" | "customType" | "delay" | "description" | "error" | "fileTypes" | "format" | "itemLabel" | "items" | "label" | "manualEntry" | "maxLength" | "minLength" | "orientation" | "prompt" | "readOnly" | "require" | "scanType" | "selectionMode" | "showFilter" | "showMinMaxLabels" | "showTickMarks" | "size" | "source" | "state" | "title" | "tooltip" | "type" | "wrap">;
 /**
  * Properties of a Form Element that can be set using `SetProperty()`.
  * Any properties defined here can also be read via the component's properties.
@@ -70,8 +69,7 @@ export interface FormElementSettableProps<TValue = undefined> extends Pick<defs.
 export interface FormElementItemProps extends FormElementItemSettableProps, Pick<defs.Item, "default" | "enabled" | "index" | "label" | "styleName" | "tooltip" | "validates" | "value" | "visible"> {
 }
 /** @public */
-export interface FormElementItemSettableProps extends Pick<defs.Item, "checked"> {
-}
+declare type FormElementItemSettableProps = Pick<defs.Item, "checked">;
 type SettablePropsFromProps<TProps extends FormElementProps> = Omit<TProps, keyof FormElementProps> & FormElementSettableProps<TProps["value"]>;
 type Unionize<T> = T[keyof T];
 /** @public */

package/forms/numberFormatter.js

@@ -1 +1 @@
-import{customFormatNumber}from"./customNumberFormat.js";var NumberDisplayFormat;!function(r){r.NUMBER="n",r.FIXED_POINT="f",r.CURRENCY="c",r.ACCOUNTING="a",r.PERCENT="p",r.ROUND_TRIP="r",r.CUSTOM="custom"}(NumberDisplayFormat=NumberDisplayFormat||{});const DEFAULT_CURRENCY="USD",DEFAULT_CUSTOM_FORMAT="#.##",DEFAULT_FRACTIONAL_DIGITS=4,SUPPORTED_CURRENCIES=["ADP","AED","AFA","AFN","ALK","ALL","AMD","ANG","AOA","AOK","AON","AOR","ARA","ARL","ARM","ARP","ARS","ATS","AUD","AWG","AZM","AZN","BAD","BAM","BAN","BBD","BDT","BEC","BEF","BEL","BGL","BGM","BGN","BGO","BHD","BIF","BMD","BND","BOB","BOL","BOP","BOV","BRB","BRC","BRE","BRL","BRN","BRR","BRZ","BSD","BTN","BUK","BWP","BYB","BYN","BYR","BZD","CAD","CDF","CHE","CHF","CHW","CLE","CLF","CLP","CNH","CNX","CNY","COP","COU","CRC","CSD","CSK","CUC","CUP","CVE","CYP","CZK","DDM","DEM","DJF","DKK","DOP","DZD","ECS","ECV","EEK","EGP","ERN","ESA","ESB","ESP","ETB","EUR","FIM","FJD","FKP","FRF","GBP","GEK","GEL","GHC","GHS","GIP","GMD","GNF","GNS","GQE","GRD","GTQ","GWE","GWP","GYD","HKD","HNL","HRD","HRK","HTG","HUF","IDR","IEP","ILP","ILR","ILS","INR","IQD","IRR","ISJ","ISK","ITL","JMD","JOD","JPY","KES","KGS","KHR","KMF","KPW","KRH","KRO","KRW","KWD","KYD","KZT","LAK","LBP","LKR","LRD","LSL","LTL","LTT","LUC","LUF","LUL","LVL","LVR","LYD","MAD","MAF","MCF","MDC","MDL","MGA","MGF","MKD","MKN","MLF","MMK","MNT","MOP","MRO","MRU","MTL","MTP","MUR","MVP","MVR","MWK","MXN","MXP","MXV","MYR","MZE","MZM","MZN","NAD","NGN","NIC","NIO","NLG","NOK","NPR","NZD","OMR","PAB","PEI","PEN","PES","PGK","PHP","PKR","PLN","PLZ","PTE","PYG","QAR","RHD","ROL","RON","RSD","RUB","RUR","RWF","SAR","SBD","SCR","SDD","SDG","SDP","SEK","SGD","SHP","SIT","SKK","SLL","SOS","SRD","SRG","SSP","STD","STN","SUR","SVC","SYP","SZL","THB","TJR","TJS","TMM","TMT","TND","TOP","TPE","TRL","TRY","TTD","TWD","TZS","UAH","UAK","UGS","UGX","USD","USN","USS","UYI","UYP","UYU","UYW","UZS","VEB","VEF","VES","VND","VNN","VUV","WST","XAF","XAG","XAU","XBA","XBB","XBC","XBD","XCD","XDR","XEU","XFO","XFU","XOF","XPD","XPF","XPT","XRE","XSU","XTS","XUA","XXX","YDD","YER","YUD","YUM","YUN","YUR","ZAL","ZAR","ZMK","ZMW","ZRN","ZRZ","ZWD","ZWL","ZWR"];function format(r,D){if(null==D||isNaN(D))return"";let t=r.format||NumberDisplayFormat.NUMBER;if(t===NumberDisplayFormat.CUSTOM&&(t=r.customDisplayFormat||DEFAULT_CUSTOM_FORMAT),t===NumberDisplayFormat.ROUND_TRIP)return D.toString();var R,N=t.toLowerCase();N===NumberDisplayFormat.CURRENCY||N===NumberDisplayFormat.ACCOUNTING?(R=r.currency||DEFAULT_CURRENCY,t=N,t+=r.fractionalDigits??"",t+=R?`$${R}`:""):N!==NumberDisplayFormat.NUMBER&&N!==NumberDisplayFormat.FIXED_POINT&&N!==NumberDisplayFormat.PERCENT||(t=N,t+=r.fractionalDigits??"");var N=r["locale"],r=`${N}|${t}`;let a=numberFormatters.get(r);return a||(a=createNumberFormatter(N,t),numberFormatters.set(r,a)),a(D)}function createNumberFormatter(D,t){const R={};let N=t.match(standardFormatPattern);if(N){var a=N[1].toLowerCase(),m=Math.min(20,parseInt(N[2]));let r=N[3];a===NumberDisplayFormat.CURRENCY||a===NumberDisplayFormat.ACCOUNTING?r=(r||DEFAULT_CURRENCY).toUpperCase():(r="",void 0===R.minimumFractionDigits&&(R.minimumFractionDigits=0),void 0===R.maximumFractionDigits&&(R.maximumFractionDigits=Math.max(DEFAULT_FRACTIONAL_DIGITS,R.minimumFractionDigits))),a===NumberDisplayFormat.PERCENT?R.style="percent":a===NumberDisplayFormat.ACCOUNTING?R.currencySign="accounting":a===NumberDisplayFormat.FIXED_POINT&&(R.useGrouping=!1),isNaN(m)||(R.minimumFractionDigits=m,R.maximumFractionDigits=m);const F=r?new Intl.NumberFormat(D,{style:"currency",currency:r,...R}):new Intl.NumberFormat(D,R);return r=>F.format(r)}return r=>customFormatNumber(r,t,D)}const numberFormatters=new Map,standardFormatPattern=/^([acfnp])(\d*)(?:\$([a-zA-Z]{3}))?$/i;export{NumberDisplayFormat,DEFAULT_CURRENCY,DEFAULT_CUSTOM_FORMAT,DEFAULT_FRACTIONAL_DIGITS,SUPPORTED_CURRENCIES,format};
+import{customFormatNumber}from"./customNumberFormat.js";var NumberDisplayFormat;!function(r){r.NUMBER="n",r.FIXED_POINT="f",r.CURRENCY="c",r.ACCOUNTING="a",r.PERCENT="p",r.ROUND_TRIP="r",r.CUSTOM="custom"}(NumberDisplayFormat=NumberDisplayFormat||{});const DEFAULT_CURRENCY="USD",DEFAULT_CUSTOM_FORMAT="#.##",DEFAULT_FRACTIONAL_DIGITS=4,SUPPORTED_CURRENCIES=["ADP","AED","AFA","AFN","ALK","ALL","AMD","ANG","AOA","AOK","AON","AOR","ARA","ARL","ARM","ARP","ARS","ATS","AUD","AWG","AZM","AZN","BAD","BAM","BAN","BBD","BDT","BEC","BEF","BEL","BGL","BGM","BGN","BGO","BHD","BIF","BMD","BND","BOB","BOL","BOP","BOV","BRB","BRC","BRE","BRL","BRN","BRR","BRZ","BSD","BTN","BUK","BWP","BYB","BYN","BYR","BZD","CAD","CDF","CHE","CHF","CHW","CLE","CLF","CLP","CNH","CNX","CNY","COP","COU","CRC","CSD","CSK","CUC","CUP","CVE","CYP","CZK","DDM","DEM","DJF","DKK","DOP","DZD","ECS","ECV","EEK","EGP","ERN","ESA","ESB","ESP","ETB","EUR","FIM","FJD","FKP","FRF","GBP","GEK","GEL","GHC","GHS","GIP","GMD","GNF","GNS","GQE","GRD","GTQ","GWE","GWP","GYD","HKD","HNL","HRD","HRK","HTG","HUF","IDR","IEP","ILP","ILR","ILS","INR","IQD","IRR","ISJ","ISK","ITL","JMD","JOD","JPY","KES","KGS","KHR","KMF","KPW","KRH","KRO","KRW","KWD","KYD","KZT","LAK","LBP","LKR","LRD","LSL","LTL","LTT","LUC","LUF","LUL","LVL","LVR","LYD","MAD","MAF","MCF","MDC","MDL","MGA","MGF","MKD","MKN","MLF","MMK","MNT","MOP","MRO","MRU","MTL","MTP","MUR","MVP","MVR","MWK","MXN","MXP","MXV","MYR","MZE","MZM","MZN","NAD","NGN","NIC","NIO","NLG","NOK","NPR","NZD","OMR","PAB","PEI","PEN","PES","PGK","PHP","PKR","PLN","PLZ","PTE","PYG","QAR","RHD","ROL","RON","RSD","RUB","RUR","RWF","SAR","SBD","SCR","SDD","SDG","SDP","SEK","SGD","SHP","SIT","SKK","SLL","SOS","SRD","SRG","SSP","STD","STN","SUR","SVC","SYP","SZL","THB","TJR","TJS","TMM","TMT","TND","TOP","TPE","TRL","TRY","TTD","TWD","TZS","UAH","UAK","UGS","UGX","USD","USN","USS","UYI","UYP","UYU","UYW","UZS","VEB","VEF","VES","VND","VNN","VUV","WST","XAF","XAG","XAU","XBA","XBB","XBC","XBD","XCD","XDR","XEU","XFO","XFU","XOF","XPD","XPF","XPT","XRE","XSU","XTS","XUA","XXX","YDD","YER","YUD","YUM","YUN","YUR","ZAL","ZAR","ZMK","ZMW","ZRN","ZRZ","ZWD","ZWL","ZWR"];function format(r,D){if(null==D||isNaN(D))return"";let t=r.format||NumberDisplayFormat.NUMBER;if(t===NumberDisplayFormat.CUSTOM&&(t=r.customDisplayFormat||DEFAULT_CUSTOM_FORMAT),t===NumberDisplayFormat.ROUND_TRIP)return D.toString();var R,N=t.toLowerCase();N===NumberDisplayFormat.CURRENCY||N===NumberDisplayFormat.ACCOUNTING?(R=r.currency||DEFAULT_CURRENCY,t=N,t+=r.fractionalDigits??"",t+=R?`$${R}`:""):N!==NumberDisplayFormat.NUMBER&&N!==NumberDisplayFormat.FIXED_POINT&&N!==NumberDisplayFormat.PERCENT||(t=N,t+=r.fractionalDigits??"");var N=r["locale"],r=`${N}|${t}`;let a=numberFormatters.get(r);return a||(a=createNumberFormatter(N,t),numberFormatters.set(r,a)),a(D)}function createNumberFormatter(D,t){const R={},N=t.match(standardFormatPattern);if(N){var a=N[1].toLowerCase(),m=Math.min(20,parseInt(N[2]));let r=N[3];a===NumberDisplayFormat.CURRENCY||a===NumberDisplayFormat.ACCOUNTING?r=(r||DEFAULT_CURRENCY).toUpperCase():(r="",void 0===R.minimumFractionDigits&&(R.minimumFractionDigits=0),void 0===R.maximumFractionDigits&&(R.maximumFractionDigits=Math.max(DEFAULT_FRACTIONAL_DIGITS,R.minimumFractionDigits))),a===NumberDisplayFormat.PERCENT?R.style="percent":a===NumberDisplayFormat.ACCOUNTING?R.currencySign="accounting":a===NumberDisplayFormat.FIXED_POINT&&(R.useGrouping=!1),isNaN(m)||(R.minimumFractionDigits=m,R.maximumFractionDigits=m);const F=r?new Intl.NumberFormat(D,{style:"currency",currency:r,...R}):new Intl.NumberFormat(D,R);return r=>F.format(r)}return r=>customFormatNumber(r,t,D)}const numberFormatters=new Map,standardFormatPattern=/^([acfnp])(\d*)(?:\$([a-zA-Z]{3}))?$/i;export{NumberDisplayFormat,DEFAULT_CURRENCY,DEFAULT_CUSTOM_FORMAT,DEFAULT_FRACTIONAL_DIGITS,SUPPORTED_CURRENCIES,format};

package/forms/numberUtilities.js

@@ -1 +1 @@
-import{format}from"./numberFormatter.js";import{isNumberRef,isNumeric}from"./utils.js";const defaultNumberFormatConfiguration={lowerBound:{default:0},precision:{default:3,minimum:-20,maximum:20},step:{default:1},upperBound:{default:100}};function getNumberConstraints(e,r){var{lowerBound:i,upperBound:t}=e=e||{};let{precision:n,step:o}=e;var u,r=getNumberFormatConfiguration(r);let a=isNumeric(i)?i:r.lowerBound.default,m=isNumeric(t)?t:r.upperBound.default;return void 0!==m&&void 0!==a&&m<=a&&(a=r.lowerBound.default,m=r.upperBound.default),n="number"!=typeof n||Number.isNaN(n)?r.precision.default:n,void 0!==r.precision.minimum&&(n=Math.max(n,r.precision.minimum)),void 0!==r.precision.maximum&&(n=Math.min(n,r.precision.maximum)),n<0?(u=Math.pow(10,-1*n),void 0!==o&&o%u==0||(o=u)):(o=isNumeric(o)&&0<o?o:r.step.default,void 0!==m&&void 0!==a&&(o=Math.min(o,m-a),u=preciseDivide(m-a,o),Number.isInteger(u)||(r=countDecimalsInValue(o),m=preciseRound(a+Math.floor(u)*o,r)))),{maximum:m,minimum:a,step:o}}const intlNumberFormat=new Intl.NumberFormat("en-US",{minimumFractionDigits:0,maximumFractionDigits:20,useGrouping:!1});function countDecimalsInValue(e){return Number.isInteger(e)?0:intlNumberFormat.formatToParts(e).filter(e=>"fraction"===e.type).map(e=>e.value).join("").length}function sanitizePrecision(e,r,i){i=getNumberFormatConfiguration(i);void 0===e&&(e=i.precision.default);r=countDecimalsInValue(r);return Math.max(r,e)}function getNumberFormatConfiguration(e){const r={lowerBound:{...defaultNumberFormatConfiguration.lowerBound},precision:{...defaultNumberFormatConfiguration.precision},step:{...defaultNumberFormatConfiguration.step},upperBound:{...defaultNumberFormatConfiguration.upperBound}};if(void 0!==e)for(const i in e)r[i]=Object.assign(r[i]||{},e[i]);return r}function preciseDivide(e,r){var i=countDecimalsInValue(e),t=countDecimalsInValue(r);if(0<i||0<t){t=Math.max(i,t),t=Math.pow(10,t);return e*t/(r*t)}return e/r}function enforceConstraints(e,r){var i,t,{maximum:n,minimum:o,step:r}=r;return void 0!==o?(i=preciseDivide(e-o,r),Number.isInteger(i)||(t=countDecimalsInValue(r),e=preciseRound(o+Math.round(i)*r,t))):void 0!==n&&(i=preciseDivide(n-e,r),Number.isInteger(i)||(t=countDecimalsInValue(r),e=preciseRound(n-Math.round(i)*r,t))),void 0!==o&&e<o&&(e=o),e=void 0!==n&&n<e?n:e}function getNumberSliderValues(e,r,i=!1){let t=[],n=NaN,o=NaN;if("string"==typeof e){const a=e.split("\n").filter(e=>""!==e);e=a.map(e=>(e=>(e=e.trim(),isNumeric(e)?parseFloat(e):NaN))(e))}else"number"==typeof e?n=e:"number"==typeof e?.numeric&&(n=e.numeric);if(Array.isArray(e)&&1<=e.length&&(n=e[0],o=e[1]),void 0===n||isNaN(n)||(n=enforceConstraints(n,r),void 0===o||isNaN(o)?i&&t.push(n):(o=enforceConstraints(o,r),t.push(n,o))),t.sort((e,r)=>e-r),t.length===(i?1:2))return t;var u=r.maximum,e=r.minimum;return i?[enforceConstraints((e+u)/2,r)]:[e,u]}function areValuesEqual(e,r){if(void 0===e&&void 0===r||null===e&&null===r)return!0;var i,t;return!(!isNumberRef(e)||!isNumberRef(r))&&(e.display===r.display&&e.refValueType===r.refValueType&&e.numeric===r.numeric&&(i=e.format,t=r.format,void 0===i&&void 0===t||void 0!==i&&void 0!==t&&(i.currency===t.currency&&i.customDisplayFormat===t.customDisplayFormat&&i.displayFormat===t.displayFormat&&i.lowerBound===t.lowerBound&&i.precision===t.precision&&i.step===t.step&&i.upperBound===t.upperBound)))}function getMarks(r,i,t,e,n,o){if(n&&o){const u=[{value:i,label:format(e,i)}];for(let e=i+t;e<r;e+=t)u.push({value:e});return u.push({value:r,label:format(e,r)}),u}return n&&!o?[{value:i,label:format(e,i)},{value:r,label:format(e,r)}]:o}function preciseRound(e,r){let i=e.toString();return i.includes("e")&&(i=e.toFixed(r)),Number(Math.round(Number(i+`e${r}`))+`e-${r}`)}function getCurrencySymbolInfo(e,r){const i=new Intl.NumberFormat(e,{style:"currency",currency:r,minimumFractionDigits:0,maximumFractionDigits:0,useGrouping:!1}),t=i.formatToParts(0);e=t.filter(e=>"currency"===e.type)[0],r=t.filter(e=>"integer"===e.type)[0];if(e&&r)return{position:t.indexOf(e)<t.indexOf(r)?"start":"end",symbol:e.value}}function getPercentSymbolInfo(e){const r=new Intl.NumberFormat(e,{style:"percent",minimumFractionDigits:0,maximumFractionDigits:0,useGrouping:!1}),i=r.formatToParts(0);var t=i.filter(e=>"percentSign"===e.type)[0],e=i.filter(e=>"integer"===e.type)[0];if(t&&e)return{position:i.indexOf(t)<i.indexOf(e)?"start":"end",symbol:t.value}}export{defaultNumberFormatConfiguration,getNumberConstraints,countDecimalsInValue,sanitizePrecision,getNumberFormatConfiguration,enforceConstraints,getNumberSliderValues,areValuesEqual,getMarks,preciseRound,getCurrencySymbolInfo,getPercentSymbolInfo};
+import{format}from"./numberFormatter.js";import{isNumberRef,isNumeric}from"./utils.js";const defaultNumberFormatConfiguration={lowerBound:{default:0},precision:{default:3,minimum:-20,maximum:20},step:{default:1},upperBound:{default:100}};function getNumberConstraints(e,r){var{lowerBound:i,upperBound:t}=e=e||{};let{precision:n,step:o}=e;var u,r=getNumberFormatConfiguration(r);let a=isNumeric(i)?i:r.lowerBound.default,m=isNumeric(t)?t:r.upperBound.default;return void 0!==m&&void 0!==a&&m<=a&&(a=r.lowerBound.default,m=r.upperBound.default),n="number"!=typeof n||Number.isNaN(n)?r.precision.default:n,void 0!==r.precision.minimum&&(n=Math.max(n,r.precision.minimum)),void 0!==r.precision.maximum&&(n=Math.min(n,r.precision.maximum)),n<0?(u=Math.pow(10,-1*n),void 0!==o&&o%u==0||(o=u)):(o=isNumeric(o)&&0<o?o:r.step.default,void 0!==m&&void 0!==a&&(o=Math.min(o,m-a),u=preciseDivide(m-a,o),Number.isInteger(u)||(r=countDecimalsInValue(o),m=preciseRound(a+Math.floor(u)*o,r)))),{maximum:m,minimum:a,step:o}}const intlNumberFormat=new Intl.NumberFormat("en-US",{minimumFractionDigits:0,maximumFractionDigits:20,useGrouping:!1});function countDecimalsInValue(e){return Number.isInteger(e)?0:intlNumberFormat.formatToParts(e).filter(e=>"fraction"===e.type).map(e=>e.value).join("").length}function sanitizePrecision(e,r,i){i=getNumberFormatConfiguration(i);void 0===e&&(e=i.precision.default);r=countDecimalsInValue(r);return Math.max(r,e)}function getNumberFormatConfiguration(e){const r={lowerBound:{...defaultNumberFormatConfiguration.lowerBound},precision:{...defaultNumberFormatConfiguration.precision},step:{...defaultNumberFormatConfiguration.step},upperBound:{...defaultNumberFormatConfiguration.upperBound}};if(void 0!==e)for(const i in e)r[i]=Object.assign(r[i]||{},e[i]);return r}function preciseDivide(e,r){var i=countDecimalsInValue(e),t=countDecimalsInValue(r);if(0<i||0<t){t=Math.max(i,t),t=Math.pow(10,t);return e*t/(r*t)}return e/r}function enforceConstraints(e,r){var i,t,{maximum:n,minimum:o,step:r}=r;return void 0!==o?(i=preciseDivide(e-o,r),Number.isInteger(i)||(t=countDecimalsInValue(r),e=preciseRound(o+Math.round(i)*r,t))):void 0!==n&&(i=preciseDivide(n-e,r),Number.isInteger(i)||(t=countDecimalsInValue(r),e=preciseRound(n-Math.round(i)*r,t))),void 0!==o&&e<o&&(e=o),e=void 0!==n&&n<e?n:e}function getNumberSliderValues(e,r,i=!1){const t=[];let n=NaN,o=NaN;if("string"==typeof e){const a=e.split("\n").filter(e=>""!==e);e=a.map(e=>(e=>(e=e.trim(),isNumeric(e)?parseFloat(e):NaN))(e))}else"number"==typeof e?n=e:"number"==typeof e?.numeric&&(n=e.numeric);if(Array.isArray(e)&&1<=e.length&&(n=e[0],o=e[1]),void 0===n||isNaN(n)||(n=enforceConstraints(n,r),void 0===o||isNaN(o)?i&&t.push(n):(o=enforceConstraints(o,r),t.push(n,o))),t.sort((e,r)=>e-r),t.length===(i?1:2))return t;var u=r.maximum,e=r.minimum;return i?[enforceConstraints((e+u)/2,r)]:[e,u]}function areValuesEqual(e,r){if(void 0===e&&void 0===r||null===e&&null===r)return!0;var i,t;return!(!isNumberRef(e)||!isNumberRef(r))&&(e.display===r.display&&e.refValueType===r.refValueType&&e.numeric===r.numeric&&(i=e.format,t=r.format,void 0===i&&void 0===t||void 0!==i&&void 0!==t&&(i.currency===t.currency&&i.customDisplayFormat===t.customDisplayFormat&&i.displayFormat===t.displayFormat&&i.lowerBound===t.lowerBound&&i.precision===t.precision&&i.step===t.step&&i.upperBound===t.upperBound)))}function getMarks(r,i,t,e,n,o){if(n&&o){const u=[{value:i,label:format(e,i)}];for(let e=i+t;e<r;e+=t)u.push({value:e});return u.push({value:r,label:format(e,r)}),u}return n&&!o?[{value:i,label:format(e,i)},{value:r,label:format(e,r)}]:o}function preciseRound(e,r){let i=e.toString();return i.includes("e")&&(i=e.toFixed(r)),Number(Math.round(Number(i+`e${r}`))+`e-${r}`)}function getCurrencySymbolInfo(e,r){const i=new Intl.NumberFormat(e,{style:"currency",currency:r,minimumFractionDigits:0,maximumFractionDigits:0,useGrouping:!1}),t=i.formatToParts(0);e=t.filter(e=>"currency"===e.type)[0],r=t.filter(e=>"integer"===e.type)[0];if(e&&r)return{position:t.indexOf(e)<t.indexOf(r)?"start":"end",symbol:e.value}}function getPercentSymbolInfo(e){const r=new Intl.NumberFormat(e,{style:"percent",minimumFractionDigits:0,maximumFractionDigits:0,useGrouping:!1}),i=r.formatToParts(0);var t=i.filter(e=>"percentSign"===e.type)[0],e=i.filter(e=>"integer"===e.type)[0];if(t&&e)return{position:i.indexOf(t)<i.indexOf(e)?"start":"end",symbol:t.value}}export{defaultNumberFormatConfiguration,getNumberConstraints,countDecimalsInValue,sanitizePrecision,getNumberFormatConfiguration,enforceConstraints,getNumberSliderValues,areValuesEqual,getMarks,preciseRound,getCurrencySymbolInfo,getPercentSymbolInfo};

package/forms/presenter.d.ts

@@ -1,5 +1,5 @@
 import type { FormPresenterHost } from "./FormComponent";
-export declare function refresh(component: {}): void;
+export declare function refresh(component: object): void;
 /**
  * Refreshes an element.
  * @param host The host for the presenter.
@@ -13,9 +13,9 @@ export declare function refreshForm(host: FormPresenterHost, container: Element)
  */
 export declare function releaseForm(container: HTMLElement): void;
 /** Renders a component's visual. */
-export declare function render(component: {}): any;
+export declare function render(component: object): any;
 /**
  * Renders an element with a placeholder.
  * @param owner
  */
-export declare function renderNone(component: {}): any;
+export declare function renderNone(component: object): any;