@vertigis/workflow 5.46.1 → 5.47.0

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=>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{getKeyString}from"../keyboard.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";export const numberRangeSliderClasses={container:`${PREFIX}-container`,inputContainer:`${PREFIX}-input-container`,toLabel:`${PREFIX}-to-label`};const 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:o,manualEntry:a,showMinMaxLabels:n,showTickMarks:m,name:i,raiseEvent:s,title:l,tooltip:u,value:c,setValue:d})=>{const p=useContext(HostContext),b=useLocale(),{currency:f,customDisplayFormat:C,decimals:F,displayFormat:g,endAdornment:N,isCustom:y,isFixedPoint:R,isPercent:S,numberConstraints:x,startAdornment:E}=useMemo(()=>{const e=o,t=e?.currency||DEFAULT_CURRENCY,r=e?.displayFormat,a=r===NumberDisplayFormat.CUSTOM,n=r===NumberDisplayFormat.FIXED_POINT,m=r===NumberDisplayFormat.PERCENT,i=getNumberConstraints(e,numberFormatConfiguration),s=e?.customDisplayFormat||DEFAULT_CUSTOM_FORMAT,l=r===NumberDisplayFormat.CUSTOM?-1:sanitizePrecision(e?.precision,i.step,numberFormatConfiguration);let u=null,c=null;if(r===NumberDisplayFormat.CURRENCY||r===NumberDisplayFormat.ACCOUNTING){const e=getCurrencySymbolInfo(b,t);if(e){const t=React.createElement(InputAdornment,{position:e.position},e.symbol);"start"===e.position?u=t:c=t}}else if(m){const e=getPercentSymbolInfo(b);if(e){const t=React.createElement(InputAdornment,{position:e.position},e.symbol);"start"===e.position?u=t:c=t}}return{currency:t,customDisplayFormat:s,decimals:l,displayFormat:r,endAdornment:c,isCustom:a,isFixedPoint:n,isPercent:m,numberConstraints:i,startAdornment:u}},[o]),{step:D}=x,A=x.maximum,v=x.minimum,[T,I]=useState(!1),[L,P]=useState(!1),[M,U]=useState([v,A]),h=useMemo(()=>g===NumberDisplayFormat.CUSTOM?[countDecimalsInCustomFormat(C,M[0]),countDecimalsInCustomFormat(C,M[1])]:[-1,-1],[M]),k=useRef(!0),[$,j]=useMemo(()=>{const e=makeUniqueId(i);return[e,`${e}-slider-input`]},[i]),O=!1!==n,w=!!m,_=!1!==a;let X=S?F-2:F;X=Math.max(0,X);const B={currency:f,customDisplayFormat:C,format:g,fractionalDigits:X,locale:b},V=()=>{const e=getNumberSliderValues(M,x);M[0]===e[0]&&M[1]===e[1]||U(e),K(c,e)||d(e)};useEffect(()=>{k.current?k.current=!1:L?Y(M):T||V()},[T,L,M]),useEffect(()=>{const e=getNumberSliderValues(c,x);K(c,e)||d(e,!1),K(M,e)||U(e)},[c]);const K=(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])),Y=useMemo(()=>throttle(e=>{s("dragged",e)}),[]),q=useFocusCallback(r,i,p),z=p.renderText(u),G=!r&&!L,H=_?{max:A,min:v,onBlur:()=>{I(!1)},onFocus:()=>{I(!0)},step:D,title:z}:void 0,J=y?h:[F,F],Q=e=>{"enter"===getKeyString(e)&&V()};return React.createElement(StyledFormElement,{className:e,element:t,inputId:`${j}-0`,name:i},React.createElement(Box,{className:numberRangeSliderClasses.container},React.createElement(Slider,{disabled:G,getAriaLabel:()=>p.renderText(l),getAriaValueText:e=>p.formatNumber(e,B),marks:getMarks(A,v,D,B,O,w),max:A,min:v,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")}`),q(e))})},step:D,title:z,value:M,valueLabelDisplay:"on",valueLabelFormat:e=>p.formatNumber(e,B)}),!1!==_&&React.createElement(NumberFormatContext.Provider,{value:{formatNumber:e=>{if(y)return customFormatNumber(e,C,B.locale);S&&(e*=100);const t={format:R?B.format:void 0,fractionalDigits:B.fractionalDigits,locale:B.locale};return p.formatNumber(e,t)},parseNumber:e=>{if(y)return parseCustomFormattedNumber(e,C,B.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:`${$}-startInput`,inputProps:H,endAdornment:N,label:p.renderText("@common-start"),max:A,maxDecimalPlaces:J[0],min:v,onChange:e=>{void 0===e&&(e=v),U([e,M[1]])},onKeyDown:Q,startAdornment:E,value:M[0]}),React.createElement(Box,{className:numberRangeSliderClasses.toLabel}," ",p.renderText("@common-to")," "),React.createElement(FormLabelNumberField,{disabled:!r,endAdornment:N,id:`${$}-endInput`,inputProps:H,label:p.renderText("@common-end"),max:A,maxDecimalPlaces:J[1],min:v,onChange:e=>{void 0===e&&(e=A),U([M[0],e])},onKeyDown:Q,startAdornment:E,value:M[1]})))))};export default NumberRangeSlider;

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=>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{getKeyString}from"../keyboard.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";export const numberSliderClasses={container:`${PREFIX}-container`};const 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:o,format:a,manualEntry:s,showMinMaxLabels:m,showTickMarks:n,name:i,raiseEvent:u,title:l,tooltip:c,value:p,setValue:d})=>{const b=useContext(HostContext),f=useLocale(),{currency:F,customDisplayFormat:y,decimals:C,displayFormat:N,endAdornment:g,isCustom:E,isFixedPoint:S,isPercent:x,numberConstraints:D,startAdornment:R}=useMemo(()=>{const e=a,t=e?.currency||DEFAULT_CURRENCY,r=e?.displayFormat,o=r===NumberDisplayFormat.CUSTOM,s=r===NumberDisplayFormat.FIXED_POINT,m=r===NumberDisplayFormat.PERCENT,n=getNumberConstraints(e),i=e?.customDisplayFormat||DEFAULT_CUSTOM_FORMAT,u=r===NumberDisplayFormat.CUSTOM?-1:sanitizePrecision(e?.precision,n.step);let l=null,c=null;if(r===NumberDisplayFormat.CURRENCY||r===NumberDisplayFormat.ACCOUNTING){const e=getCurrencySymbolInfo(f,t);if(e){const t=React.createElement(InputAdornment,{position:e.position},e.symbol);"start"===e.position?l=t:c=t}}else if(m){const e=getPercentSymbolInfo(f);if(e){const t=React.createElement(InputAdornment,{position:e.position},e.symbol);"start"===e.position?l=t:c=t}}return{currency:t,customDisplayFormat:i,decimals:u,displayFormat:r,endAdornment:c,isCustom:o,isFixedPoint:s,isPercent:m,numberConstraints:n,startAdornment:l}},[a]),{step:I}=D,A=D.maximum,T=D.minimum,[v,M]=useState(!1),[P,U]=useState(!1),[h,L]=useState(T),k=useMemo(()=>N===NumberDisplayFormat.CUSTOM?countDecimalsInCustomFormat(y,h):-1,[h]),B=useRef(!0),O=`${makeUniqueId(i)}-input`,V=!1!==m,j=!!n,_=!1!==s;let q=x?C-2:C;q=Math.max(0,q);const w={currency:F,customDisplayFormat:y,format:N,fractionalDigits:q,locale:f},$=e=>({refValueType:"number",format:{currency:F,customDisplayFormat:y,displayFormat:N,lowerBound:T,precision:C,step:I,upperBound:A},display:b.formatNumber(e,w),numeric:e}),X=()=>{const e=getNumberSliderValues(h,D,!0)[0];e!==h&&L(e);const t=$(e);areValuesEqual(p,t)||d(t)};useEffect(()=>{B.current?B.current=!1:P?z(h):v||X()},[v,P,h]),useEffect(()=>{const e=getNumberSliderValues(p,D,!0)[0],t=$(e);areValuesEqual(p,t)||d(t,!1),h!==e&&L(e)},[p]);const z=useMemo(()=>throttle(e=>{u("dragged",$(e))}),[]),K=useFocusCallback(r,i,b),Y=b.renderText(c),H=!r&&!P,G=!r,J=E?k:C;return React.createElement(StyledFormElement,{className:e,element:t,inputId:O,name:i},React.createElement(Box,{className:numberSliderClasses.container},React.createElement(Slider,{disabled:H,getAriaLabel:()=>b.renderText(l),getAriaValueText:e=>b.formatNumber(e,w),marks:getMarks(A,T,I,w,V,j),max:A,min:T,onChange:(e,t)=>{U(!0);const r=Array.isArray(t)?t[0]:t;L(r)},onChangeCommitted:()=>{U(!1)},slotProps:{input:{id:O,ref:K}},step:I,title:Y,value:"number"==typeof h?h:0,valueLabelDisplay:"on",valueLabelFormat:e=>b.formatNumber(e,w)}),!1!==_&&React.createElement(NumberFormatContext.Provider,{value:{formatNumber:e=>{if(E)return customFormatNumber(e,y,w.locale);x&&(e*=100);const t={format:S?w.format:void 0,fractionalDigits:w.fractionalDigits,locale:w.locale};return b.formatNumber(e,t)},parseNumber:e=>{if(E)return parseCustomFormattedNumber(e,y,w.locale);let t=b.coerceNumber(e,f);return x&&(t=preciseRound(t/100,C)),t}}},React.createElement(NumberInput,{correctOnBlur:!0,disabled:G,endAdornment:g,error:!!o,inputProps:{step:I,title:Y},max:A,maxDecimalPlaces:J,min:T,onBlur:()=>{M(!1)},onChange:e=>{L(void 0===e?T:e)},onFocus:()=>{M(!0)},onKeyDown:e=>{"enter"===getKeyString(e)&&X()},size:"small",startAdornment:R,value:h}))))};export default NumberSlider;

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: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;
+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),v=f.items,R=[],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 e in v){const o=v[e],a=r&&!1!==o.enabled,m=d.renderText(o.tooltip),l=o.styleName?makeSafeClassName(o.styleName):void 0;R.push(React.createElement(FormControlLabel,{className:l,control:React.createElement(Radio,{onClick:()=>{t!==e&&(c("current",e),o.value!==p?u(o.value,{item:e}):i("changed",o.value,void 0,e))},slotProps:{input:{ref:b}}}),disabled:!a,key:e,label:React.createElement(Markdown,{text:o.label}),title:m,value:e}))}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.d.ts

@@ -1,6 +1,5 @@
 import * as React from "react";
 import type { FormElementProps } from "../..";
-import type { ScanRef } from "../FormDefinition";
 import type * as defs from "../FormDefinition";
 export declare const scannerClasses: {
     container: string;

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{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};
+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";export const scannerClasses={container:`${PREFIX}-container`,button:`${PREFIX}-button`,inputContainer:`${PREFIX}-inner`};const 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)=>{const a=typeof e,r="number"===a||"string"===a?e.toString():e?.value?.toString();if(r)return t=t||e?.entryMethod||EntryMethod.Manual,{refValueType:"scan",value:r,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 f=useContext(HostContext),[E,C]=useState(!0),[S,y]=useState(null),[v,R]=useState(""),[g,T]=useState(!1),[M,w]=useState(scannerConfiguration.rows.default),h=useRef(null),I=`${makeUniqueId(o)}-input`,A="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(()=>{g&&a&&e&&(l("autoActivate",!1),O())},[g]),useEffect(()=>{S&&(C(!1),setTimeout(()=>{g&&C(!0)},1500))},[S]);const F=useFocusCallback(a,o,f);useEffect(()=>{let e=p;!isScanRef(e)&&e&&(e=convertToScanRef(e),u(e,!1));const t=e?.value||"";v!==t&&R(t)},[p]);const _=f.renderText(d),D=!a,x=D||!r,b=(e,t,n)=>{if(e){if(p?.value===e)return;const a=convertToScanRef(e,t,n);u(a),R(e)}},B=async e=>{const{BarcodeFormat:t}=await import("@zxing/browser");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},O=async()=>{if(S)return y(null),void c("cancel",void 0);const{BrowserCodeReader:e,BrowserMultiFormatReader:t}=await import("@zxing/browser");if(!g)return;const n=await(async e=>{const{DecodeHintType:t}=await import("@zxing/library"),n=await B(e),a=new Map;return a.set(t.POSSIBLE_FORMATS,n),a})(i),a=new t(n);y(a),await(async t=>{try{const n=await e.listVideoInputDevices();if(!n||0==n.length)throw new DOMException("No video input devices detected.");const a=await t.decodeOnceFromVideoDevice(void 0,h.current||void 0),r=(await B(ScanType.QrCode)).indexOf(a.getBarcodeFormat())<0?ScanType.BarCode:ScanType.QrCode;b(a.toString(),EntryMethod.Camera,r),y(null)}catch(e){e instanceof DOMException&&(l("error",e.message),y(null))}})(a)};return React.createElement(StyledFormElement,{className:t,element:n,inputId:I,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:x,fullWidth:!0,id:I,inputProps:{onKeyDown:e=>{if(A)e.stopPropagation();else{const t=e.currentTarget;y(null),b(t.value,EntryMethod.Manual)}},title:_},inputRef:F,multiline:A,onBlur:e=>{e.currentTarget.value.length>0&&(y(null),b(e.currentTarget.value,EntryMethod.Manual))},onChange:e=>{R(e.currentTarget.value)},required:s,rows:A?M:void 0,spellCheck:!1,value:v}),React.createElement(Button,{className:scannerClasses.button,color:"primary",disabled:D||!E,onClick:O,ref:F,title:_},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;

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("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};
+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";export const sectionClasses={root:`${PREFIX}-root`,basicSection:`${PREFIX}-basicSection`,fieldSetSection:`${PREFIX}-fieldSetSection`,tabSection:`${PREFIX}-tabSetSection`,title:`${PREFIX}-title`,unstyledSection:`${PREFIX}-unstyledSection`,description:`${PREFIX}-description`};const 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=null!=m?m:defs.DEFAULT_SECTION_FORMAT;const p=isAccordionSection(n),S=isFieldsetSection(n),f=isTabSection(n),b=p||f||isCollapsibleSection(n),u=`${makeUniqueId(c)}-input`,g=useFocusCallback(r,c,d);useEffect(()=>(d.refs[c]=i,()=>{d.refs[c]=void 0}),[]);const C=((e,t,o)=>React.createElement(FormLabel,{className:sectionClasses.title,error:b&&(d.hasInvalidChild(e)||!!a),id:getLabelId(t),component:o||"h6"},React.createElement(Markdown,{inline:!0,text:e.title})))(n,u,S?"legend":void 0),y=renderDescription(s,u,r,sectionClasses.description),E=renderAccessibleDescription(e,s,u,d),$=renderError(a),R=C?.props?.id,x=y?.props?.id,F=E?.props?.id,h={"aria-labelledby":R,"aria-details":x,"aria-describedby":F},v=[y,E,$,i.props.children],I=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:I,hidden:o,id:`simple-tabpanel-${c}`,role:"tabpanel"},...v);if(b)return React.createElement(StyledAccordion,{className:I,expanded:!0!==o,onChange:(e,t)=>{p&&t?d.updateMutuallyExclusiveSections(c):l("collapsed",!t)},...h},React.createElement(AccordionSummary,{expandIcon:React.createElement(ChevronDown,null),ref:g},C),...v);{const e=S?"fieldset":"section";return React.createElement(StyledSection,{className:I,component:e,...h},C,React.createElement(Box,null,...v))}};export default Section;

package/forms/components/Signature.js

@@ -1 +1 @@
-import Box from"@vertigis/react-ui/Box";import Button from"@vertigis/react-ui/Button";import Dialog from"@vertigis/react-ui/Dialog";import IconButton from"@vertigis/react-ui/IconButton";import SignatureIcon from"@vertigis/react-ui/icons/Signature";import Trash from"@vertigis/react-ui/icons/Trash";import{styled}from"@vertigis/react-ui/styles";import*as React from"react";import{useContext,useEffect,useState}from"react";import{signatureConfiguration}from"../elements/Signature.js";import HostContext from"../hostContext.js";import{makeUniqueId}from"../utils.js";import FormElement from"./FormElement.js";import Markdown from"./Markdown.js";import SignatureDialog from"./SignatureDialog.js";import{renderTitle,useFocusCallback}from"./common.js";const PREFIX="Signature",signatureClasses={button:`${PREFIX}-button`,image:`${PREFIX}-image`},StyledFormElement=styled(FormElement)(({theme:{spacing:e}})=>({[`.${signatureClasses.button}`]:{marginBottom:e(1),marginTop:e(1)},[`.${signatureClasses.image}`]:{alignItems:"flex-start",display:"flex",flexDirection:"row",gap:e(1),img:{border:"solid 1px grey",flexShrink:1,minWidth:0}}})),Signature=({className:e,element:t,enabled:a,label:i,name:r,prompt:o,require:n,setValue:s,size:l,title:m,tooltip:c,value:u})=>{const g=useContext(HostContext),[d,f]=useState(),[p,x]=useState(500),C=g.renderText(c),h=useFocusCallback(a,r,g),E=g.renderText("@common-clear");useEffect(()=>{let e=signatureConfiguration.width.default;"number"!=typeof l||isNaN(l)?"object"!=typeof l||void 0===l.width||isNaN(l.width)||(e=l.width):e=l,e=Math.max(e,signatureConfiguration.width.minimum),e=Math.min(e,signatureConfiguration.width.maximum),x(e)},[l]),useEffect(()=>{f(u?.dataUrl)},[u]);const b=async e=>{if(e){const a=await fetch(e);var t=await a.blob(),t=new File([t],`${r}.png`,{type:t.type});s({refValueType:"signature",dataUrl:e,file:t})}else s(void 0);f(e)};return React.createElement(StyledFormElement,{className:e,element:t,name:r},d?React.createElement(Box,{className:signatureClasses.image},React.createElement("img",{src:d,alt:C}),React.createElement(IconButton,{"aria-label":E,disabled:!a,onClick:()=>b(void 0),title:E},React.createElement(Trash,null))):null,d?null:React.createElement(Box,{className:signatureClasses.button},React.createElement(Button,{disabled:!a,onClick:async()=>{const e=Math.round(.4*p);await g.displayDialog(a=>React.createElement(SignatureDialog,{cancelCaption:g.renderText("@common-cancel"),clearCaption:E,doneCaption:g.renderText("@common-done"),format:"image/png",height:e,helperText:React.createElement(Markdown,{inline:!0,text:i}),host:g,onClose:(e,t)=>{e&&b(t),a()},title:renderTitle(makeUniqueId(r+"-dialog"),n,m),undoCaption:g.renderText("@common-undo"),width:p}),Dialog)},ref:h,startIcon:React.createElement(SignatureIcon,null),title:C,variant:"outlined"},React.createElement(Markdown,{inline:!0,text:o||""}))))};export default Signature;export{signatureClasses};
+import Box from"@vertigis/react-ui/Box";import Button from"@vertigis/react-ui/Button";import Dialog from"@vertigis/react-ui/Dialog";import IconButton from"@vertigis/react-ui/IconButton";import SignatureIcon from"@vertigis/react-ui/icons/Signature";import Trash from"@vertigis/react-ui/icons/Trash";import{styled}from"@vertigis/react-ui/styles";import*as React from"react";import{useContext,useEffect,useState}from"react";import{signatureConfiguration}from"../elements/Signature.js";import HostContext from"../hostContext.js";import{makeUniqueId}from"../utils.js";import FormElement from"./FormElement.js";import Markdown from"./Markdown.js";import SignatureDialog from"./SignatureDialog.js";import{renderTitle,useFocusCallback}from"./common.js";const PREFIX="Signature";export const signatureClasses={button:`${PREFIX}-button`,image:`${PREFIX}-image`};const StyledFormElement=styled(FormElement)(({theme:{spacing:e}})=>({[`.${signatureClasses.button}`]:{marginBottom:e(1),marginTop:e(1)},[`.${signatureClasses.image}`]:{alignItems:"flex-start",display:"flex",flexDirection:"row",gap:e(1),img:{border:"solid 1px grey",flexShrink:1,minWidth:0}}})),Signature=({className:e,element:t,enabled:a,label:i,name:o,prompt:r,require:n,setValue:l,size:s,title:m,tooltip:c,value:u})=>{const g=useContext(HostContext),[d,f]=useState(),[p,x]=useState(500),C=g.renderText(c),h=useFocusCallback(a,o,g),E=g.renderText("@common-clear");useEffect(()=>{let e=signatureConfiguration.width.default;"number"!=typeof s||isNaN(s)?"object"!=typeof s||void 0===s.width||isNaN(s.width)||(e=s.width):e=s,e=Math.max(e,signatureConfiguration.width.minimum),e=Math.min(e,signatureConfiguration.width.maximum),x(e)},[s]),useEffect(()=>{f(u?.dataUrl)},[u]);const b=async e=>{if(e){const t=await fetch(e),a=await t.blob(),i=new File([a],`${o}.png`,{type:a.type});l({refValueType:"signature",dataUrl:e,file:i})}else l(void 0);f(e)};return React.createElement(StyledFormElement,{className:e,element:t,name:o},d?React.createElement(Box,{className:signatureClasses.image},React.createElement("img",{src:d,alt:C}),React.createElement(IconButton,{"aria-label":E,disabled:!a,onClick:()=>b(void 0),title:E},React.createElement(Trash,null))):null,d?null:React.createElement(Box,{className:signatureClasses.button},React.createElement(Button,{disabled:!a,onClick:async()=>{const e=Math.round(.4*p);await g.displayDialog(t=>React.createElement(SignatureDialog,{cancelCaption:g.renderText("@common-cancel"),clearCaption:E,doneCaption:g.renderText("@common-done"),format:"image/png",height:e,helperText:React.createElement(Markdown,{inline:!0,text:i}),host:g,onClose:(e,a)=>{e&&b(a),t()},title:renderTitle(makeUniqueId(o+"-dialog"),n,m),undoCaption:g.renderText("@common-undo"),width:p}),Dialog)},ref:h,startIcon:React.createElement(SignatureIcon,null),title:C,variant:"outlined"},React.createElement(Markdown,{inline:!0,text:r||""}))))};export default Signature;

package/forms/components/SignatureDialog.js

@@ -1 +1 @@
-import Box from"@vertigis/react-ui/Box";import Button from"@vertigis/react-ui/Button";import DialogActions from"@vertigis/react-ui/DialogActions";import DialogContent from"@vertigis/react-ui/DialogContent";import DialogTitle from"@vertigis/react-ui/DialogTitle";import IconButton from"@vertigis/react-ui/IconButton";import Skeleton from"@vertigis/react-ui/Skeleton";import Stack from"@vertigis/react-ui/Stack";import Typography from"@vertigis/react-ui/Typography";import Trash from"@vertigis/react-ui/icons/Trash";import Undo from"@vertigis/react-ui/icons/Undo";import{styled}from"@vertigis/react-ui/styles";import*as React from"react";import{lazy,Suspense}from"react";import{HostProvider}from"../hostContext.js";const SignaturePadWrapper=lazy(()=>import("react-signature-pad-wrapper")),DialogPrefix="SignatureDialog",signatureDialogClasses={canvas:`${DialogPrefix}-canvas`,canvasAnnotations:`${DialogPrefix}-canvas-annotations`,container:`${DialogPrefix}-container`,mark:`${DialogPrefix}-mark`,titleText:`${DialogPrefix}-title-text`},StyledDialogTitle=styled(DialogTitle)(()=>({display:"flex",[`.${signatureDialogClasses.titleText}`]:{flexGrow:1,flexShrink:1}})),StyledDialogContent=styled(DialogContent)(({theme:{spacing:e,typography:t}})=>({[`.${signatureDialogClasses.container}`]:{backgroundColor:"#eee",filter:"drop-shadow(2px 2px 2px grey)",[`.${signatureDialogClasses.canvas}`]:{position:"relative",zIndex:1},[`.${signatureDialogClasses.canvasAnnotations}`]:{alignItems:"center",display:"flex",flexDirection:"column",marginTop:t.pxToRem(-64),paddingLeft:e(1),paddingRight:e(1),position:"relative",zIndex:0,[`.${signatureDialogClasses.mark}`]:{fontSize:"large",borderBottom:"solid 1px black",width:"100%"}}}})),NonItalicCaption=styled(Typography)(()=>({fontStyle:"inherit"})),SignatureDialog=({cancelCaption:e,clearCaption:t,doneCaption:a,format:i,height:o,helperText:r,host:n,title:l,undoCaption:s,width:c,onClose:g})=>{let m,p,u;return React.createElement(HostProvider,{value:n},React.createElement(StyledDialogTitle,null,React.createElement("div",{className:signatureDialogClasses.titleText},l),React.createElement(Stack,{direction:"row"},React.createElement(IconButton,{"aria-label":s,onClick:async()=>{if(m){const e=m.toData();e.pop(),m.fromData(e)}},title:s},React.createElement(Undo,null)),React.createElement(IconButton,{"aria-label":t,onClick:async()=>{p&&p.clear()},title:t},React.createElement(Trash,null)))),React.createElement(StyledDialogContent,null,React.createElement(Box,{className:signatureDialogClasses.container,sx:{height:`${o}px`,width:`${c}px`}},React.createElement(Suspense,{fallback:React.createElement(Skeleton,{variant:"rectangular",width:c,height:o})},React.createElement(SignaturePadWrapper,{canvasProps:{className:signatureDialogClasses.canvas},ref:e=>{m=e||void 0,p=m?.instance||void 0,u=m?.canvas?.current||void 0,u&&(u.oncontextmenu=()=>!1,u.height=o,u.width=c)}}),React.createElement(Box,{className:signatureDialogClasses.canvasAnnotations},React.createElement(Typography,{"aria-hidden":!0,className:signatureDialogClasses.mark},"X"),React.createElement(NonItalicCaption,{variant:"caption"},r))))),React.createElement(DialogActions,null,React.createElement(Button,{color:"primary",onClick:()=>{let e;p&&!p.isEmpty()&&(e=p.toDataURL(i)),g(!0,e)},variant:"contained"},a),React.createElement(Button,{color:"inherit",onClick:()=>{g(!1,void 0)},variant:"outlined"},e)))};export default SignatureDialog;export{signatureDialogClasses};
+import Box from"@vertigis/react-ui/Box";import Button from"@vertigis/react-ui/Button";import DialogActions from"@vertigis/react-ui/DialogActions";import DialogContent from"@vertigis/react-ui/DialogContent";import DialogTitle from"@vertigis/react-ui/DialogTitle";import IconButton from"@vertigis/react-ui/IconButton";import Skeleton from"@vertigis/react-ui/Skeleton";import Stack from"@vertigis/react-ui/Stack";import Typography from"@vertigis/react-ui/Typography";import Trash from"@vertigis/react-ui/icons/Trash";import Undo from"@vertigis/react-ui/icons/Undo";import{styled}from"@vertigis/react-ui/styles";import*as React from"react";import{lazy,Suspense}from"react";import{HostProvider}from"../hostContext.js";const SignaturePadWrapper=lazy(()=>import("react-signature-pad-wrapper")),DialogPrefix="SignatureDialog";export const signatureDialogClasses={canvas:`${DialogPrefix}-canvas`,canvasAnnotations:`${DialogPrefix}-canvas-annotations`,container:`${DialogPrefix}-container`,mark:`${DialogPrefix}-mark`,titleText:`${DialogPrefix}-title-text`};const StyledDialogTitle=styled(DialogTitle)(()=>({display:"flex",[`.${signatureDialogClasses.titleText}`]:{flexGrow:1,flexShrink:1}})),StyledDialogContent=styled(DialogContent)(({theme:{spacing:e,typography:t}})=>({[`.${signatureDialogClasses.container}`]:{backgroundColor:"#eee",filter:"drop-shadow(2px 2px 2px grey)",[`.${signatureDialogClasses.canvas}`]:{position:"relative",zIndex:1},[`.${signatureDialogClasses.canvasAnnotations}`]:{alignItems:"center",display:"flex",flexDirection:"column",marginTop:t.pxToRem(-64),paddingLeft:e(1),paddingRight:e(1),position:"relative",zIndex:0,[`.${signatureDialogClasses.mark}`]:{fontSize:"large",borderBottom:"solid 1px black",width:"100%"}}}})),NonItalicCaption=styled(Typography)(()=>({fontStyle:"inherit"})),SignatureDialog=({cancelCaption:e,clearCaption:t,doneCaption:a,format:i,height:o,helperText:r,host:n,title:l,undoCaption:s,width:c,onClose:g})=>{let m,p,u;return React.createElement(HostProvider,{value:n},React.createElement(StyledDialogTitle,null,React.createElement("div",{className:signatureDialogClasses.titleText},l),React.createElement(Stack,{direction:"row"},React.createElement(IconButton,{"aria-label":s,onClick:async()=>{if(m){const e=m.toData();e.pop(),m.fromData(e)}},title:s},React.createElement(Undo,null)),React.createElement(IconButton,{"aria-label":t,onClick:async()=>{p&&p.clear()},title:t},React.createElement(Trash,null)))),React.createElement(StyledDialogContent,null,React.createElement(Box,{className:signatureDialogClasses.container,sx:{height:`${o}px`,width:`${c}px`}},React.createElement(Suspense,{fallback:React.createElement(Skeleton,{variant:"rectangular",width:c,height:o})},React.createElement(SignaturePadWrapper,{canvasProps:{className:signatureDialogClasses.canvas},ref:e=>{m=e||void 0,p=m?.instance||void 0,u=m?.canvas?.current||void 0,u&&(u.oncontextmenu=()=>!1,u.height=o,u.width=c)}}),React.createElement(Box,{className:signatureDialogClasses.canvasAnnotations},React.createElement(Typography,{"aria-hidden":!0,className:signatureDialogClasses.mark},"X"),React.createElement(NonItalicCaption,{variant:"caption"},r))))),React.createElement(DialogActions,null,React.createElement(Button,{color:"primary",onClick:()=>{let e;p&&!p.isEmpty()&&(e=p.toDataURL(i)),g(!0,e)},variant:"contained"},a),React.createElement(Button,{color:"inherit",onClick:()=>{g(!1,void 0)},variant:"outlined"},e)))};export default SignatureDialog;

package/forms/components/Sketch.js

@@ -1 +1 @@
-import Box from"@vertigis/react-ui/Box";import Button from"@vertigis/react-ui/Button";import Dialog,{dialogClasses}from"@vertigis/react-ui/Dialog";import IconButton from"@vertigis/react-ui/IconButton";import Stack from"@vertigis/react-ui/Stack";import Edit from"@vertigis/react-ui/icons/Edit";import Trash from"@vertigis/react-ui/icons/Trash";import{styled}from"@vertigis/react-ui/styles";import*as React from"react";import{useContext,useEffect,useRef,useState}from"react";import HostContext from"../hostContext.js";import{makeUniqueId}from"../utils.js";import FormElement from"./FormElement.js";import Markdown from"./Markdown.js";import SketchDialog from"./SketchDialog.js";import{renderTitle,useFocusCallback}from"./common.js";const PREFIX="Sketch",sketchClasses={button:`${PREFIX}-button`,imagePanel:`${PREFIX}-image-panel`,imageScroller:`${PREFIX}-image-scroller`},StyledFormElement=styled(FormElement)(({theme:{spacing:e}})=>({[`.${sketchClasses.button}`]:{marginBottom:e(1),marginTop:e(1)},[`.${sketchClasses.imagePanel}`]:{alignItems:"flex-start",display:"flex",flexDirection:"row",gap:e(1),img:{border:"solid 1px grey",maxWidth:"100%",minWidth:0}}})),StyledDialog=styled(Dialog)(()=>({[`.${dialogClasses.paper}`]:{maxWidth:"inherit"}})),Sketch=({className:e,element:t,enabled:a,name:i,prompt:r,require:o,setValue:l,size:s,source:c,title:n,tooltip:m,value:u})=>{const d=useContext(HostContext),[f,g]=useState(),[h,p]=useState(),[k,E]=useState(),[R,v]=useState(),x=useRef([]),y=useRef(),b=d.renderText(m),C=useFocusCallback(a,i,d);useEffect(()=>{var e,t;"object"==typeof s&&(e=void 0===s.height||isNaN(s.height)?void 0:s.height,t=void 0===s.width||isNaN(s.width)?void 0:s.width,p(e),v(t))},[s]),useEffect(()=>{g("object"==typeof u?u.dataUrl:void 0)},[u]),useEffect(()=>{var e;return y.current&&(URL.revokeObjectURL(y.current),y.current=void 0),"string"==typeof c?E(c):c instanceof File&&(e=URL.createObjectURL(c),E(e),y.current=e),()=>{y.current&&URL.revokeObjectURL(y.current)}},[c]);const S=async e=>{if(e){const r=await fetch(e);var t=await r.blob(),t=new File([t],`${i}.png`,{type:t.type});l({refValueType:"sketch",dataUrl:e,file:t})}else l(void 0);g(e)},w=!!k&&!!f,F=async()=>{await d.displayDialog(r=>React.createElement(SketchDialog,{dataUrl:f,height:h,history:x.current,host:d,onClose:(e,t)=>{e&&t&&(S(t.dataUrl),v(t.width),p(t.height),x.current=t.history),r()},source:k,title:renderTitle(makeUniqueId(i+"-dialog"),o,n),width:R}),StyledDialog)};return React.createElement(StyledFormElement,{className:e,element:t,name:i},(()=>{if(!f&&!k)return null;var e=f||k,t=d.renderText("@common-clear"),r=d.renderText("@common-edit");return React.createElement(Box,{className:sketchClasses.imagePanel},React.createElement("img",{src:e,alt:b}),w&&React.createElement(Stack,null,React.createElement(IconButton,{"aria-label":r,disabled:!a,onClick:F,ref:C,title:r},React.createElement(Edit,null)),React.createElement(IconButton,{"aria-label":t,disabled:!a,onClick:()=>{S(void 0),x.current=[]},title:t},React.createElement(Trash,null))))})(),w?null:React.createElement(Box,{className:sketchClasses.button},React.createElement(Button,{disabled:!a||!k,onClick:F,ref:e=>{k&&C(e)},title:b,variant:"outlined"},React.createElement(Markdown,{inline:!0,text:r||""}))))};export default Sketch;export{sketchClasses};
+import Box from"@vertigis/react-ui/Box";import Button from"@vertigis/react-ui/Button";import Dialog,{dialogClasses}from"@vertigis/react-ui/Dialog";import IconButton from"@vertigis/react-ui/IconButton";import Stack from"@vertigis/react-ui/Stack";import Edit from"@vertigis/react-ui/icons/Edit";import Trash from"@vertigis/react-ui/icons/Trash";import{styled}from"@vertigis/react-ui/styles";import*as React from"react";import{useContext,useEffect,useRef,useState}from"react";import HostContext from"../hostContext.js";import{makeUniqueId}from"../utils.js";import FormElement from"./FormElement.js";import Markdown from"./Markdown.js";import SketchDialog from"./SketchDialog.js";import{renderTitle,useFocusCallback}from"./common.js";const PREFIX="Sketch";export const sketchClasses={button:`${PREFIX}-button`,imagePanel:`${PREFIX}-image-panel`,imageScroller:`${PREFIX}-image-scroller`};const StyledFormElement=styled(FormElement)(({theme:{spacing:e}})=>({[`.${sketchClasses.button}`]:{marginBottom:e(1),marginTop:e(1)},[`.${sketchClasses.imagePanel}`]:{alignItems:"flex-start",display:"flex",flexDirection:"row",gap:e(1),img:{border:"solid 1px grey",maxWidth:"100%",minWidth:0}}})),StyledDialog=styled(Dialog)(()=>({[`.${dialogClasses.paper}`]:{maxWidth:"inherit"}})),Sketch=({className:e,element:t,enabled:r,name:a,prompt:i,require:o,setValue:l,size:s,source:c,title:n,tooltip:m,value:u})=>{const d=useContext(HostContext),[f,g]=useState(),[h,p]=useState(),[E,k]=useState(),[R,x]=useState(),y=useRef([]),b=useRef(),v=d.renderText(m),S=useFocusCallback(r,a,d);useEffect(()=>{if("object"==typeof s){const e=void 0===s.height||isNaN(s.height)?void 0:s.height,t=void 0===s.width||isNaN(s.width)?void 0:s.width;p(e),x(t)}},[s]),useEffect(()=>{g("object"==typeof u?u.dataUrl:void 0)},[u]),useEffect(()=>{if(b.current&&(URL.revokeObjectURL(b.current),b.current=void 0),"string"==typeof c)k(c);else if(c instanceof File){const e=URL.createObjectURL(c);k(e),b.current=e}return()=>{b.current&&URL.revokeObjectURL(b.current)}},[c]);const C=async e=>{if(e){const t=await fetch(e),r=await t.blob(),i=new File([r],`${a}.png`,{type:r.type});l({refValueType:"sketch",dataUrl:e,file:i})}else l(void 0);g(e)},w=!!E&&!!f,F=async()=>{await d.displayDialog(e=>React.createElement(SketchDialog,{dataUrl:f,height:h,history:y.current,host:d,onClose:(t,r)=>{t&&r&&(C(r.dataUrl),x(r.width),p(r.height),y.current=r.history),e()},source:E,title:renderTitle(makeUniqueId(a+"-dialog"),o,n),width:R}),StyledDialog)};return React.createElement(StyledFormElement,{className:e,element:t,name:a},(()=>{if(!f&&!E)return null;const e=f||E,t=d.renderText("@common-clear"),a=d.renderText("@common-edit");return React.createElement(Box,{className:sketchClasses.imagePanel},React.createElement("img",{src:e,alt:v}),w&&React.createElement(Stack,null,React.createElement(IconButton,{"aria-label":a,disabled:!r,onClick:F,ref:S,title:a},React.createElement(Edit,null)),React.createElement(IconButton,{"aria-label":t,disabled:!r,onClick:()=>{C(void 0),y.current=[]},title:t},React.createElement(Trash,null))))})(),w?null:React.createElement(Box,{className:sketchClasses.button},React.createElement(Button,{disabled:!r||!E,onClick:F,ref:e=>{E&&S(e)},title:v,variant:"outlined"},React.createElement(Markdown,{inline:!0,text:i||""}))))};export default Sketch;

package/forms/components/SketchDialog.js

@@ -1 +1 @@
-import Box from"@vertigis/react-ui/Box";import Button from"@vertigis/react-ui/Button";import DialogActions from"@vertigis/react-ui/DialogActions";import DialogContent from"@vertigis/react-ui/DialogContent";import DialogTitle from"@vertigis/react-ui/DialogTitle";import FormControl from"@vertigis/react-ui/FormControl";import FormControlLabel from"@vertigis/react-ui/FormControlLabel";import FormLabel from"@vertigis/react-ui/FormLabel";import FormLabelColorField from"@vertigis/react-ui/FormLabelColorField";import IconButton from"@vertigis/react-ui/IconButton";import Radio from"@vertigis/react-ui/Radio";import RadioGroup from"@vertigis/react-ui/RadioGroup";import Slider from"@vertigis/react-ui/Slider";import Stack from"@vertigis/react-ui/Stack";import Trash from"@vertigis/react-ui/icons/Trash";import Undo from"@vertigis/react-ui/icons/Undo";import{styled}from"@vertigis/react-ui/styles";import*as React from"react";import{useEffect,useRef,useState}from"react";import{HostProvider}from"../hostContext.js";const DialogPrefix="SketchDialog",sketchDialogClasses={canvasContainer:`${DialogPrefix}-canvas-container`,canvasScroller:`${DialogPrefix}-canvas-scroller`,drawingCanvas:`${DialogPrefix}-drawing-canvas`,highlightCanvas:`${DialogPrefix}-highlight-canvas`,size:`${DialogPrefix}-size`,titleText:`${DialogPrefix}-title-text`},StyledDialogTitle=styled(DialogTitle)(()=>({display:"flex",[`.${sketchDialogClasses.titleText}`]:{flexGrow:1,flexShrink:1}})),StyledDialogContent=styled(DialogContent)(({theme:{spacing:e}})=>({display:"flex",flexDirection:"column",alignItems:"center",[`.${sketchDialogClasses.size}`]:{marginLeft:e(2),width:"15rem"},[`.${sketchDialogClasses.canvasScroller}`]:{maxWidth:"100%",overflow:"auto",[`.${sketchDialogClasses.canvasContainer}`]:{lineHeight:0,overflow:"clip",canvas:{position:"relative",[`&.${sketchDialogClasses.highlightCanvas}`]:{opacity:.5}}}}}));function isDrawingHistoryItem(e){return Array.isArray(e.points)}const PenColours=["#F13B2F","#42A345","#049FF1","#FFE600","#000000","#FFFFFF"],HighlighterColours=["#FFE600","#26E600","#44C8F5","#EC008C","#FF5500","#6600CC"],SketchDialog=({dataUrl:n,height:e,history:c,host:t,onClose:r,source:s,title:o,width:a})=>{const[g,u]=useState(e||0),[m,h]=useState(a||0),[d,l]=useState(PenColours[0]),[C,i]=useState(3),[p,f]=useState(HighlighterColours[0]),[v,x]=useState(12),[R,D]=useState("pen"),y="highlighter"===R,k=useRef(null),E=useRef(null),F=useRef(null),S=useRef([]),w=useRef([]),T=useRef(!1),b=useRef(!1),P=e=>(e?"highlighter"!==e?F:E:y?E:F).current,$=async e=>{let r,o;var t=new Promise((e,t)=>{r=e,o=t});const a=new Image;return a.crossOrigin="anonymous",a.onerror=e=>{o(e)},a.onload=()=>{r(a)},a.src=e,a.complete&&r(a),t};useEffect(()=>{(async()=>{const o=k.current,a=F.current;if(o&&a&&!T.current){let r;try{r=await $(s)}catch(e){console.error(`Error loading image from ${s}.`,e)}if(r){let e=Math.max(m,0),t=Math.max(g,0);var{height:l,width:i}=r;0==e&&0==t?(t=l,e=i):0===t?t=e*(l/i):0===e&&(e=t*(i/l)),o.height=t,o.width=e,a.height=t,a.width=e,o.getContext("2d").drawImage(r,0,0,o.width,o.height),0<c.length?(w.current=[...c],await U()):n&&(w.current=[{tool:"pen",dataUrl:n}],await U()),u(t),h(e),T.current=!0}else I()}})()},[k.current,F.current]);const B=(e,t)=>{t=t.getBoundingClientRect();return{x:e.clientX-t.left,y:e.clientY-t.top}};var L=()=>{if(b.current){b.current=!1;const e=P(),t=e.getContext("2d");t.closePath(),w.current.push({lineCap:t.lineCap,lineWidth:t.lineWidth,points:[...S.current],strokeStyle:t.strokeStyle,tool:R}),S.current.length=0}};const I=()=>{r(!1)};const U=async e=>{for(const l of w.current)if(!e||l.tool===e){const i=P(l.tool);if(isDrawingHistoryItem(l)){const n=i.getContext("2d");n.beginPath(),n.lineCap=l.lineCap,n.lineWidth=l.lineWidth,n.strokeStyle=l.strokeStyle;var t=l["points"];for(let e=0;e<t.length;e++){var{x:r,y:o}=t[e];0===e?n.moveTo(r,o):(n.lineTo(r,o),n.stroke())}n.closePath()}else{var a=await $(l.dataUrl);i.getContext("2d").drawImage(a,0,0,i.width,i.height)}}};e=t.renderText("@common-clear"),a=t.renderText("@common-undo");return React.createElement(HostProvider,{value:t},React.createElement(StyledDialogTitle,null,React.createElement("div",{className:sketchDialogClasses.titleText},o),React.createElement(Stack,{direction:"row"},React.createElement(IconButton,{"aria-label":a,onClick:async()=>{if(0!==w.current.length){var e=w.current.pop()["tool"];const t=P(e),r=t.getContext("2d");r.clearRect(0,0,m,g),await U(e)}},title:a},React.createElement(Undo,null)),React.createElement(IconButton,{"aria-label":e,onClick:()=>{E.current.getContext("2d").clearRect(0,0,m,g),F.current.getContext("2d").clearRect(0,0,m,g),w.current=[]},title:e},React.createElement(Trash,null)))),React.createElement(StyledDialogContent,null,React.createElement(Box,null,React.createElement(FormControl,null,React.createElement(FormLabel,null,t.renderText("@sketch-tool")),React.createElement(RadioGroup,{onChange:e=>D(e.currentTarget.value),row:!0,value:R},React.createElement(FormControlLabel,{control:React.createElement(Radio,null),value:"pen",label:t.renderText("@sketch-tool-pen")}),React.createElement(FormControlLabel,{control:React.createElement(Radio,null),value:"highlighter",label:t.renderText("@sketch-tool-highlighter")}))),React.createElement(FormLabelColorField,{label:t.renderText("@common-color"),value:y?p:d,ColorInputProps:{presetColors:y?HighlighterColours:PenColours},onChange:e=>{(y?f:l)(e)}}),React.createElement(FormControl,{className:sketchDialogClasses.size},React.createElement(FormLabel,null,t.renderText("@sketch-size")),React.createElement(Slider,{min:1,value:y?v:C,onChange:(e,t)=>{(y?x:i)(t)}}))),React.createElement(Box,{className:sketchDialogClasses.canvasScroller},React.createElement(Box,{sx:{width:`${m}px`,height:`${g}px`},className:sketchDialogClasses.canvasContainer},React.createElement("canvas",{ref:k}),React.createElement("canvas",{className:sketchDialogClasses.highlightCanvas,height:g,ref:E,style:{top:`-${g}px`},width:m}),React.createElement("canvas",{className:sketchDialogClasses.drawingCanvas,onMouseDown:e=>{const t=P(),r=t.getContext("2d");var{x:o,y:a}=B(e,t),{lineCap:l,lineWidth:i,strokeStyle:e}=y?{lineCap:"butt",lineWidth:v,strokeStyle:p}:{lineCap:"round",lineWidth:C,strokeStyle:d};r.beginPath(),r.lineCap=l,r.lineWidth=i,r.strokeStyle=e,r.moveTo(o,a),S.current.length=0,S.current.push({x:o,y:a}),b.current=!0},onMouseLeave:L,onMouseMove:e=>{if(b.current){const r=P(),o=r.getContext("2d");var{x:t,y:e}=B(e,r);o.lineTo(t,e),o.stroke(),S.current.push({x:t,y:e})}},onMouseUp:L,ref:F,style:{top:`-${2*g}px`}})))),React.createElement(DialogActions,null,React.createElement(Button,{color:"primary",onClick:()=>{if(0!==w.current.length){const t=k.current.getContext("2d");t.globalAlpha=.5,t.drawImage(E.current,0,0),t.globalAlpha=1,t.drawImage(F.current,0,0);var e=k.current.toDataURL("image/png");r(!0,{dataUrl:e,history:[...w.current],width:m,height:g})}else I()},variant:"contained"},t.renderText("@common-done")),React.createElement(Button,{color:"inherit",onClick:I,variant:"outlined"},t.renderText("@common-cancel"))))};export default SketchDialog;export{sketchDialogClasses};
+import Box from"@vertigis/react-ui/Box";import Button from"@vertigis/react-ui/Button";import DialogActions from"@vertigis/react-ui/DialogActions";import DialogContent from"@vertigis/react-ui/DialogContent";import DialogTitle from"@vertigis/react-ui/DialogTitle";import FormControl from"@vertigis/react-ui/FormControl";import FormControlLabel from"@vertigis/react-ui/FormControlLabel";import FormLabel from"@vertigis/react-ui/FormLabel";import FormLabelColorField from"@vertigis/react-ui/FormLabelColorField";import IconButton from"@vertigis/react-ui/IconButton";import Radio from"@vertigis/react-ui/Radio";import RadioGroup from"@vertigis/react-ui/RadioGroup";import Slider from"@vertigis/react-ui/Slider";import Stack from"@vertigis/react-ui/Stack";import Trash from"@vertigis/react-ui/icons/Trash";import Undo from"@vertigis/react-ui/icons/Undo";import{styled}from"@vertigis/react-ui/styles";import*as React from"react";import{useEffect,useRef,useState}from"react";import{HostProvider}from"../hostContext.js";const DialogPrefix="SketchDialog";export const sketchDialogClasses={canvasContainer:`${DialogPrefix}-canvas-container`,canvasScroller:`${DialogPrefix}-canvas-scroller`,drawingCanvas:`${DialogPrefix}-drawing-canvas`,highlightCanvas:`${DialogPrefix}-highlight-canvas`,size:`${DialogPrefix}-size`,titleText:`${DialogPrefix}-title-text`};const StyledDialogTitle=styled(DialogTitle)(()=>({display:"flex",[`.${sketchDialogClasses.titleText}`]:{flexGrow:1,flexShrink:1}})),StyledDialogContent=styled(DialogContent)(({theme:{spacing:e}})=>({display:"flex",flexDirection:"column",alignItems:"center",[`.${sketchDialogClasses.size}`]:{marginLeft:e(2),width:"15rem"},[`.${sketchDialogClasses.canvasScroller}`]:{maxWidth:"100%",overflow:"auto",[`.${sketchDialogClasses.canvasContainer}`]:{lineHeight:0,overflow:"clip",canvas:{position:"relative",[`&.${sketchDialogClasses.highlightCanvas}`]:{opacity:.5}}}}}));function isDrawingHistoryItem(e){return Array.isArray(e.points)}const PenColours=["#F13B2F","#42A345","#049FF1","#FFE600","#000000","#FFFFFF"],HighlighterColours=["#FFE600","#26E600","#44C8F5","#EC008C","#FF5500","#6600CC"],SketchDialog=({dataUrl:e,height:t,history:r,host:o,onClose:a,source:n,title:l,width:i})=>{const[c,s]=useState(t||0),[u,g]=useState(i||0),[m,h]=useState(PenColours[0]),[d,C]=useState(3),[p,f]=useState(HighlighterColours[0]),[v,x]=useState(12),[R,y]=useState("pen"),D="highlighter"===R,k=useRef(null),E=useRef(null),F=useRef(null),S=useRef([]),w=useRef([]),T=useRef(!1),b=useRef(!1),P=e=>e?"highlighter"===e?E.current:F.current:D?E.current:F.current,$=async e=>{let t,r;const o=new Promise((e,o)=>{t=e,r=o}),a=new Image;return a.crossOrigin="anonymous",a.onerror=e=>{r(e)},a.onload=()=>{t(a)},a.src=e,a.complete&&t(a),o};useEffect(()=>{(async()=>{const t=k.current,o=F.current;if(t&&o&&!T.current){let a;try{a=await $(n)}catch(e){console.error(`Error loading image from ${n}.`,e)}if(!a)return void I();let l=Math.max(u,0),i=Math.max(c,0);const{height:m,width:h}=a;0==l&&0==i?(i=m,l=h):0===i?i=l*(m/h):0===l&&(l=i*(h/m)),t.height=i,t.width=l,o.height=i,o.width=l,t.getContext("2d").drawImage(a,0,0,t.width,t.height),r.length>0?(w.current=[...r],await U()):e&&(w.current=[{tool:"pen",dataUrl:e}],await U()),s(i),g(l),T.current=!0}})()},[k.current,F.current]);const B=(e,t)=>{const r=t.getBoundingClientRect();return{x:e.clientX-r.left,y:e.clientY-r.top}},L=()=>{if(!b.current)return;b.current=!1;const e=P().getContext("2d");e.closePath(),w.current.push({lineCap:e.lineCap,lineWidth:e.lineWidth,points:[...S.current],strokeStyle:e.strokeStyle,tool:R}),S.current.length=0},I=()=>{a(!1)},U=async e=>{for(const t of w.current){if(e&&t.tool!==e)continue;const r=P(t.tool);if(isDrawingHistoryItem(t)){const e=r.getContext("2d");e.beginPath(),e.lineCap=t.lineCap,e.lineWidth=t.lineWidth,e.strokeStyle=t.strokeStyle;const{points:o}=t;for(let t=0;t<o.length;t++){const{x:r,y:a}=o[t];0===t?e.moveTo(r,a):(e.lineTo(r,a),e.stroke())}e.closePath()}else{const e=await $(t.dataUrl);r.getContext("2d").drawImage(e,0,0,r.width,r.height)}}},W=o.renderText("@common-clear"),A=o.renderText("@common-undo");return React.createElement(HostProvider,{value:o},React.createElement(StyledDialogTitle,null,React.createElement("div",{className:sketchDialogClasses.titleText},l),React.createElement(Stack,{direction:"row"},React.createElement(IconButton,{"aria-label":A,onClick:async()=>{if(0===w.current.length)return;const e=w.current.pop(),{tool:t}=e;P(t).getContext("2d").clearRect(0,0,u,c),await U(t)},title:A},React.createElement(Undo,null)),React.createElement(IconButton,{"aria-label":W,onClick:()=>{E.current.getContext("2d").clearRect(0,0,u,c),F.current.getContext("2d").clearRect(0,0,u,c),w.current=[]},title:W},React.createElement(Trash,null)))),React.createElement(StyledDialogContent,null,React.createElement(Box,null,React.createElement(FormControl,null,React.createElement(FormLabel,null,o.renderText("@sketch-tool")),React.createElement(RadioGroup,{onChange:e=>y(e.currentTarget.value),row:!0,value:R},React.createElement(FormControlLabel,{control:React.createElement(Radio,null),value:"pen",label:o.renderText("@sketch-tool-pen")}),React.createElement(FormControlLabel,{control:React.createElement(Radio,null),value:"highlighter",label:o.renderText("@sketch-tool-highlighter")}))),React.createElement(FormLabelColorField,{label:o.renderText("@common-color"),value:D?p:m,ColorInputProps:{presetColors:D?HighlighterColours:PenColours},onChange:e=>{D?f(e):h(e)}}),React.createElement(FormControl,{className:sketchDialogClasses.size},React.createElement(FormLabel,null,o.renderText("@sketch-size")),React.createElement(Slider,{min:1,value:D?v:d,onChange:(e,t)=>{D?x(t):C(t)}}))),React.createElement(Box,{className:sketchDialogClasses.canvasScroller},React.createElement(Box,{sx:{width:`${u}px`,height:`${c}px`},className:sketchDialogClasses.canvasContainer},React.createElement("canvas",{ref:k}),React.createElement("canvas",{className:sketchDialogClasses.highlightCanvas,height:c,ref:E,style:{top:`-${c}px`},width:u}),React.createElement("canvas",{className:sketchDialogClasses.drawingCanvas,onMouseDown:e=>{const t=P(),r=t.getContext("2d"),{x:o,y:a}=B(e,t),{lineCap:n,lineWidth:l,strokeStyle:i}=D?{lineCap:"butt",lineWidth:v,strokeStyle:p}:{lineCap:"round",lineWidth:d,strokeStyle:m};r.beginPath(),r.lineCap=n,r.lineWidth=l,r.strokeStyle=i,r.moveTo(o,a),S.current.length=0,S.current.push({x:o,y:a}),b.current=!0},onMouseLeave:L,onMouseMove:e=>{if(!b.current)return;const t=P(),r=t.getContext("2d"),{x:o,y:a}=B(e,t);r.lineTo(o,a),r.stroke(),S.current.push({x:o,y:a})},onMouseUp:L,ref:F,style:{top:`-${2*c}px`}})))),React.createElement(DialogActions,null,React.createElement(Button,{color:"primary",onClick:()=>{if(0===w.current.length)return void I();const e=k.current.getContext("2d");e.globalAlpha=.5,e.drawImage(E.current,0,0),e.globalAlpha=1,e.drawImage(F.current,0,0);const t=k.current.toDataURL("image/png");a(!0,{dataUrl:t,history:[...w.current],width:u,height:c})},variant:"contained"},o.renderText("@common-done")),React.createElement(Button,{color:"inherit",onClick:I,variant:"outlined"},o.renderText("@common-cancel"))))};export default SketchDialog;

package/forms/components/TabGroup.js

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

package/forms/components/TextArea.js

@@ -1 +1 @@
-import Input from"@vertigis/react-ui/Input";import{useContext,useEffect,useState}from"react";import*as React from"react";import HostContext from"../hostContext.js";import{makeUniqueId}from"../utils.js";import FormElement from"./FormElement.js";import{useFocusCallback}from"./common.js";const TextArea=({className:e,component:t,element:o,enabled:r,name:a,maxLength:n,prompt:s,readOnly:m,require:u,size:l,tooltip:i,value:p,wrap:f,setValue:c})=>{const d=useContext(HostContext),[x,g]=useState(8),[E,C]=useState(""),[h,y]=useState("soft"),I=`${makeUniqueId(a)}-input`,b=d.renderText(s),v=d.renderText(i);useEffect(()=>{"number"==typeof l&&g(l)},[l]),useEffect(()=>{let e="string"==typeof p?p:"";p!==e&&(c(e,!1),t.forceUpdate()),C(e)},[p]),useEffect(()=>{"string"==typeof f&&-1!==["hard","soft","off"].indexOf(f)&&y(f)},[f]);const F=e=>{e=e.target.value;e!=p&&(c(e),C(e))},j=e=>{e=e.target.value;e!=E&&C(e)},k=e=>{e.stopPropagation()},q=useFocusCallback(r,a,d);return React.createElement(FormElement,{className:e,element:o,inputId:I,name:a},e=>React.createElement(Input,{disabled:!r,fullWidth:!0,id:I,inputProps:{...e,maxLength:n,onKeyDown:k,title:v,wrap:h},inputRef:q,multiline:!0,onBlur:F,onChange:j,placeholder:b,readOnly:m,required:u,rows:x,value:E}))};export default TextArea;
+import Input from"@vertigis/react-ui/Input";import{useContext,useEffect,useState}from"react";import*as React from"react";import HostContext from"../hostContext.js";import{makeUniqueId}from"../utils.js";import FormElement from"./FormElement.js";import{useFocusCallback}from"./common.js";const TextArea=({className:e,component:t,element:o,enabled:r,name:n,maxLength:a,prompt:s,readOnly:m,require:u,size:l,tooltip:i,value:p,wrap:c,setValue:f})=>{const d=useContext(HostContext),[x,g]=useState(8),[E,C]=useState(""),[h,y]=useState("soft"),I=`${makeUniqueId(n)}-input`,b=d.renderText(s),v=d.renderText(i);useEffect(()=>{"number"==typeof l&&g(l)},[l]),useEffect(()=>{let e="";"string"==typeof p&&(e=p),p!==e&&(f(e,!1),t.forceUpdate()),C(e)},[p]),useEffect(()=>{"string"==typeof c&&-1!==["hard","soft","off"].indexOf(c)&&y(c)},[c]);const F=e=>{const t=e.target.value;t!=p&&(f(t),C(t))},j=e=>{const t=e.target.value;t!=E&&C(t)},k=e=>{e.stopPropagation()},q=useFocusCallback(r,n,d);return React.createElement(FormElement,{className:e,element:o,inputId:I,name:n},e=>React.createElement(Input,{disabled:!r,fullWidth:!0,id:I,inputProps:{...e,maxLength:a,onKeyDown:k,title:v,wrap:h},inputRef:q,multiline:!0,onBlur:F,onChange:j,placeholder:b,readOnly:m,required:u,rows:x,value:E}))};export default TextArea;

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(""),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;
+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:s,readOnly:m,require:u,tooltip:l,value:i,setValue:p})=>{const c=useContext(HostContext),[f,d]=useState(""),x=`${makeUniqueId(a)}-input`,g=o===FormElementTypes.PASSWORDBOX,y=g?void 0:n,v=c.renderText(s),E=g?void 0:m,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=>{const t=e.target.value;t!=i&&T(t)},F=e=>{const t=e.target.value;t!=f&&d(t)},h=e=>{const t=getKeyString(e);return"enter"===t?(e=>{const t=e.currentTarget.value;t!==i&&T(t)})(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:y,onKeyDown:h,title:C},inputRef:j,onBlur:b,onChange:F,placeholder:v,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,getAmPm,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 P={locale:useLocale(),timezone:(new Intl.DateTimeFormat).resolvedOptions().timeZone},F=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,P,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),F.current)return void(F.current=!1);var e=getNewElementValue(x,S,P,R);areValuesEqual(u,e)||m(e)}F.current=!1},[p,f,k]);const{min:b,max:y}=getDateBounds(a),j=getAmPm(a),N=useMemo(()=>`${makeUniqueId(s)}-input`,[s]),D=c.renderText(i);return React.createElement(FormElement,{className:e,element:t,inputId:N,name:s},e=>React.createElement(React.Fragment,null,V&&React.createElement(FormHelperText,{component:"div",error:!0,role:"alert"},C.current),React.createElement(StyledTimePicker,{ampm:j,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:N,inputProps:{...e,placeholder:D},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,getAmPm,getDateBounds,getNewElementValue,makeProperValue}from"../dateUtilities.js";import HostContext from"../hostContext.js";import{getKeyString}from"../keyboard.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:m,setValue:l,tooltip:n,value:u})=>{const c=useContext(HostContext),[p,d]=useState(!1),[f,T]=useState(!1),[k,E]=useState(!1),[g,x]=useState(null),C=useRef(),P={locale:useLocale(),timezone:(new Intl.DateTimeFormat).resolvedOptions().timeZone},v=useRef(!0),F=useFocusCallback(r,s,c),y=c.renderText(n),S=Calendar.useNative(),B="time",R=isInvalidError(o),b=()=>{const e=getNewElementValue(g,B,P,S);areValuesEqual(u,e)||l(e)};useEffect(()=>{const e=makeProperValue(u,S),t=getNewElementValue(e,B,P,S);areValuesEqual(u,t)||l(t,!1),x(e||null)},[u]),useEffect(()=>{if(!k&&!f)if(p)R||m("error",{status:"invalid"});else{if(R&&m("error",void 0),v.current)return void(v.current=!1);b()}v.current=!1},[p,f,k]);const{min:V,max:j}=getDateBounds(a),N=getAmPm(a),D=useMemo(()=>`${makeUniqueId(s)}-input`,[s]),I=c.renderText(i),q=e=>{"enter"!==getKeyString(e)||b()};return React.createElement(FormElement,{className:e,element:t,inputId:D,name:s},e=>React.createElement(React.Fragment,null,R&&React.createElement(FormHelperText,{component:"div",error:!0,role:"alert"},C.current),React.createElement(StyledTimePicker,{ampm:N,disabled:!r,inputRef:e=>{e&&(C.current=e.dataset.formatString,F(e))},key:"date-picker",maxTime:j,minTime:V,onChange:e=>x(e),onClose:()=>E(!1),onError:e=>d(!!e),onOpen:()=>E(!0),slots:{textField:DateTimeTextField},slotProps:{textField:{error:!!o,id:D,inputProps:{...e,placeholder:I},onBlur:()=>T(!1),onFocus:()=>T(!0),onKeyDown:q,title:y}},value:g})))};export default TimePicker;

package/forms/components/common.js

@@ -1 +1 @@
-import Box from"@vertigis/react-ui/Box";import FormLabel,{formLabelClasses}from"@vertigis/react-ui/FormLabel";import{styled}from"@vertigis/react-ui/styles";import clsx from"clsx";import{useCallback}from"react";import*as React from"react";import{hasContent,isMarkdown,markdownToText}from"../textUtilities.js";import{getAccessibleDescriptionId,getDescriptionId,getLabelId}from"../utils.js";import{formClasses}from"./Form.js";import Markdown from"./Markdown.js";function renderTitle(e,r,t,o,s){return hasContent(t)?React.createElement(FormLabel,{className:formClasses.formElementTitle,component:s,htmlFor:o,id:getLabelId(e),required:!!r},React.createElement(Markdown,{inline:!0,text:t})):null}const DescriptionMarkdown=styled(Markdown)(({theme:{palette:e}})=>({[`&.${formLabelClasses.disabled}`]:{color:e.text.disabled}}));function renderDescription(e,r,t,o){return hasContent(e)?React.createElement(DescriptionMarkdown,{className:clsx(o,{[formLabelClasses.disabled]:!t}),id:getDescriptionId(r),text:e}):null}function renderAccessibleDescription(e,r,t,o){let s=o.translateText(e);return s||(r=o.translateText(r),s=isMarkdown(r)?markdownToText(r.markdown):r),s?React.createElement(Box,{hidden:!0,id:getAccessibleDescriptionId(t)},s):null}const ErrorMarkdown=styled(Markdown)(({theme:{palette:e}})=>({color:e.custom.errorText,fontStyle:"italic",backgroundColor:e.custom.errorBackground}));function renderError(e){return hasContent(e)?React.createElement(ErrorMarkdown,{role:"alert",text:e}):null}function useFocusCallback(e,r,t){return useCallback(e=>{null===(e=Array.isArray(e?.thumbRefs)&&0<e.thumbRefs.length?e.thumbRefs[0].current:e)||e.disabled||t.renderFocus(e,r)},[e,r,t])}export{renderTitle,renderDescription,renderAccessibleDescription,renderError,useFocusCallback};
+import Box from"@vertigis/react-ui/Box";import FormLabel,{formLabelClasses}from"@vertigis/react-ui/FormLabel";import{styled}from"@vertigis/react-ui/styles";import clsx from"clsx";import{useCallback}from"react";import*as React from"react";import{hasContent,isMarkdown,markdownToText}from"../textUtilities.js";import{getAccessibleDescriptionId,getDescriptionId,getLabelId}from"../utils.js";import{formClasses}from"./Form.js";import Markdown from"./Markdown.js";export function renderTitle(e,r,t,o,s){return hasContent(t)?React.createElement(FormLabel,{className:formClasses.formElementTitle,component:s,htmlFor:o,id:getLabelId(e),required:!!r},React.createElement(Markdown,{inline:!0,text:t})):null}const DescriptionMarkdown=styled(Markdown)(({theme:{palette:e}})=>({[`&.${formLabelClasses.disabled}`]:{color:e.text.disabled}}));export function renderDescription(e,r,t,o){return hasContent(e)?React.createElement(DescriptionMarkdown,{className:clsx(o,{[formLabelClasses.disabled]:!t}),id:getDescriptionId(r),text:e}):null}export function renderAccessibleDescription(e,r,t,o){let s=o.translateText(e);if(!s){const e=o.translateText(r);s=isMarkdown(e)?markdownToText(e.markdown):e}return s?React.createElement(Box,{hidden:!0,id:getAccessibleDescriptionId(t)},s):null}const ErrorMarkdown=styled(Markdown)(({theme:{palette:e}})=>({color:e.custom.errorText,fontStyle:"italic",backgroundColor:e.custom.errorBackground}));export function renderError(e){return hasContent(e)?React.createElement(ErrorMarkdown,{role:"alert",text:e}):null}export function useFocusCallback(e,r,t){return useCallback(e=>{Array.isArray(e?.thumbRefs)&&e.thumbRefs.length>0&&(e=e.thumbRefs[0].current),null===e||e.disabled||t.renderFocus(e,r)},[e,r,t])}

package/forms/constants.js

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

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

package/forms/dateUtilities.d.ts

@@ -103,7 +103,7 @@ export declare function getLocaleDateFormatTokenPosition(token: "yyyy" | "dd" |
  * Inputs that can be converted to a DateRangeRef. Requires two values that can be converted into
  * start and end dates
  */
-export type DateRangeLike = (Date | number | string)[] | {
+type DateRangeLike = (Date | number | string)[] | {
     startDate: Date | string;
     endDate: Date | string;
 };

package/forms/dateUtilities.js

@@ -1 +1 @@
-import{parse,isAfter}from"date-fns";import{DEFAULT_LOCALE}from"../constants.js";import{parseLocale}from"../definition/ProgramInspector.js";import{Calendar}from"./Calendar.js";import{isDateRangeRef,isDateTimeRef}from"./utils.js";const CURRENT_CENTURY_YEAR_CUTOFF=29,SUPPORTED_DATE_FNS_LOCALES=["cs","da","de","de-AT","en-AU","en-CA","en-GB","en-IN","en-NZ","en-US","en-ZA","fr","fr-CA","fr-CH","it","nb","nl","nl-BE","nn","pt","pt-BR"];let localeDateFormat="",dateFormatSeparator;function areValuesEqual(e,a){return void 0===e&&void 0===a||null===e&&null===a||(isDateTimeRef(e)&&a&&isDateTimeRef(a)?e.display===a.display&&e.refValueType===a.refValueType&&e.value===a.value&&areFormatsEqual(e.format,a.format):!!(isDateRangeRef(e)&&a&&isDateRangeRef(a))&&(e.endDate?.valueOf()===a.endDate?.valueOf()&&e.refValueType===a.refValueType&&e.startDate?.valueOf()===a.startDate?.valueOf()))}function areFormatsEqual(e,a){return void 0===e&&void 0===a||("string"==typeof e&&"string"==typeof a?e===a:"object"==typeof e&&"object"==typeof a&&(null===e||null===a?e===a:e.locale===a.locale&&e.timezone===a.timezone))}function isValidDate(e){return e instanceof Date&&!isNaN(e.valueOf())}function tryParseYear(e){if(/^\d+$/.test(e)&&!(4<e.length)){for(2===e.length&&(e=`${CURRENT_CENTURY_YEAR_CUTOFF>=parseInt(e,10)?20:19}${e}`);e.length<4;)e=`0${e}`;return e}}function tryParseMonth(e){if(/^\d+$/.test(e)&&!(2<e.length)){1===e.length&&(e=`0${e}`);var a=parseInt(e,10);if(!(a<1||12<a))return e}}function tryParseDay(e){if(/^\d+$/.test(e)&&!(2<e.length)){1===e.length&&(e=`0${e}`);var a=parseInt(e,10);if(!(a<1||31<a))return e}}function tryParseDateText(e){if(e){const r=(e=e.replace(/\\/g,"\\\\")).match(/(\d+)/g);if(3===r?.length){var e=getLocaleDateFormatSeparator(),a=getLocaleDateFormatTokenPosition("yyyy"),t=getLocaleDateFormatTokenPosition("MM");for(let e=0;e<3;e++){switch(e){case a:r[e]=tryParseYear(r[e]);break;case t:r[e]=tryParseMonth(r[e]);break;default:r[e]=tryParseDay(r[e])}if(void 0===r[e])return}return`${r[0]}${e}${r[1]}${e}${r[2]}`}}}const MinUIDate=new Date(0,0);MinUIDate.setFullYear(1);const MaxUIDate=new Date(9999,11,31,23,59,59,999);var TimeFormat;function getAmPm(e){var e=(e||{})["timeFormat"];switch(e){case"12-hour":return!0;case"24-hour":return!1;default:return}}function getDateBounds(e){var{lowerBound:a,upperBound:e}=e||{};return{min:a?new Date(a):MinUIDate,max:e?new Date(e):MaxUIDate}}function getTargetLanguages(e){e=parseLocale(e);if(!e)return[DEFAULT_LOCALE];const a=[];return e.territory&&a.push(`${e.language}-${e.territory}`),a.push(e.language),a.push(DEFAULT_LOCALE),a}async function getDateFnsLocale(e){for(const a of getTargetLanguages(e))if(-1!==SUPPORTED_DATE_FNS_LOCALES.indexOf(a)){let e;try{switch(a){case"cs":e=(await import("date-fns/locale/cs")).cs;break;case"da":e=(await import("date-fns/locale/da")).da;break;case"de":e=(await import("date-fns/locale/de")).de;break;case"de-AT":e=(await import("date-fns/locale/de-AT")).deAT;break;case"en-AU":e=(await import("date-fns/locale/en-AU")).enAU;break;case"en-CA":e=(await import("date-fns/locale/en-CA")).enCA;break;case"en-GB":e=(await import("date-fns/locale/en-GB")).enGB;break;case"en-IN":e=(await import("date-fns/locale/en-IN")).enIN;break;case"en-NZ":e=(await import("date-fns/locale/en-NZ")).enNZ;break;case"en-US":e=(await import("date-fns/locale/en-US")).enUS;break;case"en-ZA":e=(await import("date-fns/locale/en-ZA")).enZA;break;case"fr":e=(await import("date-fns/locale/fr")).fr;break;case"fr-CA":e=(await import("date-fns/locale/fr-CA")).frCA;break;case"fr-CH":e=(await import("date-fns/locale/fr-CH")).frCH;break;case"it":e=(await import("date-fns/locale/it")).it;break;case"nb":e=(await import("date-fns/locale/nb")).nb;break;case"nl":e=(await import("date-fns/locale/nl")).nl;break;case"nl-BE":e=(await import("date-fns/locale/nl-BE")).nlBE;break;case"nn":e=(await import("date-fns/locale/nn")).nn;break;case"pt":e=(await import("date-fns/locale/pt")).pt;break;case"pt-BR":e=(await import("date-fns/locale/pt-BR")).ptBR}}catch{continue}if(e?.localize)return e}}async function getLocaleText(e){for(const a of getTargetLanguages(e))if(-1!==SUPPORTED_DATE_FNS_LOCALES.indexOf(a)){let e;try{switch(a){case"cs":e=(await import("@mui/x-date-pickers/locales/csCZ")).csCZ;break;case"da":e=(await import("@mui/x-date-pickers/locales/daDK")).daDK;break;case"de":case"de-AT":e=(await import("@mui/x-date-pickers/locales/deDE")).deDE;break;case"en-AU":case"en-CA":case"en-GB":case"en-IN":case"en-NZ":case"en-US":case"en-ZA":case"nn":e=(await import("@mui/x-date-pickers/locales/enUS")).enUS;break;case"fr":case"fr-CA":case"fr-CH":e=(await import("@mui/x-date-pickers/locales/frFR")).frFR;break;case"it":e=(await import("@mui/x-date-pickers/locales/itIT")).itIT;break;case"nb":e=(await import("@mui/x-date-pickers/locales/nbNO")).nbNO;break;case"nl":case"nl-BE":e=(await import("@mui/x-date-pickers/locales/nlNL")).nlNL;break;case"pt":case"pt-BR":e=(await import("@mui/x-date-pickers/locales/ptBR")).ptBR}}catch{continue}return e?e.components.MuiLocalizationProvider.defaultProps.localeText:{}}}function getLocaleDateFormat(){if(localeDateFormat)return localeDateFormat;const e=new Date(1999,11,31,0,0,0);return localeDateFormat=e.toLocaleDateString(void 0,{year:"numeric",month:"numeric",day:"numeric"}),localeDateFormat=localeDateFormat.replace("1999","yyyy"),localeDateFormat=localeDateFormat.replace("99","yyyy"),localeDateFormat=localeDateFormat.replace("12","MM"),localeDateFormat=localeDateFormat.replace("31","dd"),localeDateFormat}function getLocaleDateFormatSeparator(){var e;return void 0===dateFormatSeparator&&(e=/[^dMy]+/.exec(getLocaleDateFormat()),dateFormatSeparator=e?e[0]:""),dateFormatSeparator}function getLocaleDateFormatTokenPosition(e){const a=getLocaleDateFormat();var t=a.indexOf("yyyy"),r=a.indexOf("MM"),o=a.indexOf("dd");return"yyyy"===e?0===t?0:r<t&&o<t?2:1:"MM"===e?0===r?0:o<r&&t<r?2:1:0===o?0:r<o&&t<o?2:1}!function(e){e.AUTO="auto",e.HOURS_12="12-hour",e.HOURS_24="24-hour"}(TimeFormat=TimeFormat||{});const coerceIntoDate=e=>{if(e instanceof Date&&isValidDate(e))return new Date(e.valueOf());if("string"==typeof e)if(/^\d+$/.test(e))e=Number(e);else{var a=tryParseDateText(e);if(a){var t=getLocaleDateFormat(),t=parse(a,t,0);if(isValidDate(t))return t}}if("number"==typeof e){e=new Date(e);if(isValidDate(e))return e}};function convertToDateRangeRef(e){let a,t,r=!1;Array.isArray(e)?(a=coerceIntoDate(e[0]),t=coerceIntoDate(e[1]),r=!0):"object"==typeof e&&(a=coerceIntoDate(e.startDate),t=coerceIntoDate(e.endDate));var o=!!a&&!!t;let n=o&&!isAfter(a,t);return r&&o&&!n&&(e=a,a=t,t=e,n=!0),o&&n?{refValueType:"daterange",startDate:a,endDate:t}:void 0}function __test__setlocaleDateFormatInCache(e){localeDateFormat=e,dateFormatSeparator=void 0}async function getLocale(e){return getDateFnsLocale(e)}function makeProperValue(e,a){if("object"==typeof e){if(null===e)return;switch(e.refValueType){case"date":case"time":case"datetime":break;default:return}e=e.value}if("number"==typeof e||"string"==typeof e){const t=a.coerceIntoValue(e);if(void 0!==t&&null!==t&&isFinite(t.valueOf()))return t}}function getNewElementValue(e,a,t,r){if(null!=e&&isFinite(e.valueOf()))return{refValueType:a,format:t,display:r.format(e,Calendar.fullFormat),value:e.valueOf()}}export{areValuesEqual,isValidDate,tryParseYear,tryParseMonth,tryParseDay,tryParseDateText,MinUIDate,MaxUIDate,TimeFormat,getAmPm,getDateBounds,getDateFnsLocale,getLocaleText,getLocaleDateFormat,getLocaleDateFormatSeparator,getLocaleDateFormatTokenPosition,convertToDateRangeRef,__test__setlocaleDateFormatInCache,getLocale,makeProperValue,getNewElementValue};
+import{parse,isAfter}from"date-fns";import{DEFAULT_LOCALE}from"../constants.js";import{parseLocale}from"../definition/ProgramInspector.js";import{Calendar}from"./Calendar.js";import{isDateRangeRef,isDateTimeRef}from"./utils.js";const CURRENT_CENTURY_YEAR_CUTOFF=29,SUPPORTED_DATE_FNS_LOCALES=["cs","da","de","de-AT","en-AU","en-CA","en-GB","en-IN","en-NZ","en-US","en-ZA","fr","fr-CA","fr-CH","it","nb","nl","nl-BE","nn","pt","pt-BR"];let dateFormatSeparator,localeDateFormat="";export function areValuesEqual(e,a){return void 0===e&&void 0===a||null===e&&null===a||(isDateTimeRef(e)&&a&&isDateTimeRef(a)?e.display===a.display&&e.refValueType===a.refValueType&&e.value===a.value&&areFormatsEqual(e.format,a.format):!!(isDateRangeRef(e)&&a&&isDateRangeRef(a))&&(e.endDate?.valueOf()===a.endDate?.valueOf()&&e.refValueType===a.refValueType&&e.startDate?.valueOf()===a.startDate?.valueOf()))}function areFormatsEqual(e,a){return void 0===e&&void 0===a||("string"==typeof e&&"string"==typeof a?e===a:"object"==typeof e&&"object"==typeof a&&(null===e||null===a?e===a:e.locale===a.locale&&e.timezone===a.timezone))}export function isValidDate(e){return e instanceof Date&&!isNaN(e.valueOf())}export function tryParseYear(e){if(/^\d+$/.test(e)&&!(e.length>4)){if(2===e.length){e=`${29>=parseInt(e,10)?20:19}${e}`}for(;e.length<4;)e=`0${e}`;return e}}export function tryParseMonth(e){if(!/^\d+$/.test(e)||e.length>2)return;1===e.length&&(e=`0${e}`);const a=parseInt(e,10);return a<1||a>12?void 0:e}export function tryParseDay(e){if(!/^\d+$/.test(e)||e.length>2)return;1===e.length&&(e=`0${e}`);const a=parseInt(e,10);return a<1||a>31?void 0:e}export function tryParseDateText(e){if(!e)return;const a=(e=e.replace(/\\/g,"\\\\")).match(/(\d+)/g);if(3===a?.length){const e=getLocaleDateFormatSeparator(),t=getLocaleDateFormatTokenPosition("yyyy"),r=getLocaleDateFormatTokenPosition("MM");for(let e=0;e<3;e++){switch(e){case t:a[e]=tryParseYear(a[e]);break;case r:a[e]=tryParseMonth(a[e]);break;default:a[e]=tryParseDay(a[e])}if(void 0===a[e])return}return`${a[0]}${e}${a[1]}${e}${a[2]}`}}export const MinUIDate=new Date(0,0);MinUIDate.setFullYear(1);export const MaxUIDate=new Date(9999,11,31,23,59,59,999);export var TimeFormat;!function(e){e.AUTO="auto",e.HOURS_12="12-hour",e.HOURS_24="24-hour"}(TimeFormat||(TimeFormat={}));export function getAmPm(e){const{timeFormat:a}=e||{};switch(a){case"12-hour":return!0;case"24-hour":return!1;default:return}}export function getDateBounds(e){const{lowerBound:a,upperBound:t}=e||{};return{min:a?new Date(a):MinUIDate,max:t?new Date(t):MaxUIDate}}function getTargetLanguages(e){const a=parseLocale(e);if(!a)return[DEFAULT_LOCALE];const t=[];return a.territory&&t.push(`${a.language}-${a.territory}`),t.push(a.language),t.push(DEFAULT_LOCALE),t}export async function getDateFnsLocale(e){const a=getTargetLanguages(e);for(const e of a){if(-1===SUPPORTED_DATE_FNS_LOCALES.indexOf(e))continue;let a;try{switch(e){case"cs":a=(await import("date-fns/locale/cs")).cs;break;case"da":a=(await import("date-fns/locale/da")).da;break;case"de":a=(await import("date-fns/locale/de")).de;break;case"de-AT":a=(await import("date-fns/locale/de-AT")).deAT;break;case"en-AU":a=(await import("date-fns/locale/en-AU")).enAU;break;case"en-CA":a=(await import("date-fns/locale/en-CA")).enCA;break;case"en-GB":a=(await import("date-fns/locale/en-GB")).enGB;break;case"en-IN":a=(await import("date-fns/locale/en-IN")).enIN;break;case"en-NZ":a=(await import("date-fns/locale/en-NZ")).enNZ;break;case"en-US":a=(await import("date-fns/locale/en-US")).enUS;break;case"en-ZA":a=(await import("date-fns/locale/en-ZA")).enZA;break;case"fr":a=(await import("date-fns/locale/fr")).fr;break;case"fr-CA":a=(await import("date-fns/locale/fr-CA")).frCA;break;case"fr-CH":a=(await import("date-fns/locale/fr-CH")).frCH;break;case"it":a=(await import("date-fns/locale/it")).it;break;case"nb":a=(await import("date-fns/locale/nb")).nb;break;case"nl":a=(await import("date-fns/locale/nl")).nl;break;case"nl-BE":a=(await import("date-fns/locale/nl-BE")).nlBE;break;case"nn":a=(await import("date-fns/locale/nn")).nn;break;case"pt":a=(await import("date-fns/locale/pt")).pt;break;case"pt-BR":a=(await import("date-fns/locale/pt-BR")).ptBR}}catch{continue}if(a?.localize)return a}}export async function getLocaleText(e){const a=getTargetLanguages(e);for(const e of a){if(-1===SUPPORTED_DATE_FNS_LOCALES.indexOf(e))continue;let a;try{switch(e){case"cs":a=(await import("@mui/x-date-pickers/locales/csCZ")).csCZ;break;case"da":a=(await import("@mui/x-date-pickers/locales/daDK")).daDK;break;case"de":case"de-AT":a=(await import("@mui/x-date-pickers/locales/deDE")).deDE;break;case"en-AU":case"en-CA":case"en-GB":case"en-IN":case"en-NZ":case"en-US":case"en-ZA":case"nn":a=(await import("@mui/x-date-pickers/locales/enUS")).enUS;break;case"fr":case"fr-CA":case"fr-CH":a=(await import("@mui/x-date-pickers/locales/frFR")).frFR;break;case"it":a=(await import("@mui/x-date-pickers/locales/itIT")).itIT;break;case"nb":a=(await import("@mui/x-date-pickers/locales/nbNO")).nbNO;break;case"nl":case"nl-BE":a=(await import("@mui/x-date-pickers/locales/nlNL")).nlNL;break;case"pt":case"pt-BR":a=(await import("@mui/x-date-pickers/locales/ptBR")).ptBR}}catch{continue}return a?a.components.MuiLocalizationProvider.defaultProps.localeText:{}}}export function getLocaleDateFormat(){if(localeDateFormat)return localeDateFormat;const e=new Date(1999,11,31,0,0,0);return localeDateFormat=e.toLocaleDateString(void 0,{year:"numeric",month:"numeric",day:"numeric"}),localeDateFormat=localeDateFormat.replace("1999","yyyy"),localeDateFormat=localeDateFormat.replace("99","yyyy"),localeDateFormat=localeDateFormat.replace("12","MM"),localeDateFormat=localeDateFormat.replace("31","dd"),localeDateFormat}export function getLocaleDateFormatSeparator(){if(void 0===dateFormatSeparator){const e=/[^dMy]+/.exec(getLocaleDateFormat());dateFormatSeparator=e?e[0]:""}return dateFormatSeparator}export function getLocaleDateFormatTokenPosition(e){const a=getLocaleDateFormat(),t=a.indexOf("yyyy"),r=a.indexOf("MM"),o=a.indexOf("dd");return"yyyy"===e?0===t?0:t>r&&t>o?2:1:"MM"===e?0===r?0:r>o&&r>t?2:1:0===o?0:o>r&&o>t?2:1}const coerceIntoDate=e=>{if(e instanceof Date&&isValidDate(e))return new Date(e.valueOf());if("string"==typeof e)if(/^\d+$/.test(e))e=Number(e);else{const a=tryParseDateText(e);if(a){const e=getLocaleDateFormat(),t=parse(a,e,0);if(isValidDate(t))return t}}if("number"==typeof e){const a=new Date(e);if(isValidDate(a))return a}};export function convertToDateRangeRef(e){let a,t,r=!1;Array.isArray(e)?(a=coerceIntoDate(e[0]),t=coerceIntoDate(e[1]),r=!0):"object"==typeof e&&(a=coerceIntoDate(e.startDate),t=coerceIntoDate(e.endDate));const o=!!a&&!!t;let n=o&&!isAfter(a,t);if(r&&o&&!n){const e=a;a=t,t=e,n=!0}return o&&n?{refValueType:"daterange",startDate:a,endDate:t}:void 0}export function __test__setlocaleDateFormatInCache(e){localeDateFormat=e,dateFormatSeparator=void 0}export async function getLocale(e){return await getDateFnsLocale(e)}export function makeProperValue(e,a){if("object"==typeof e){if(null===e)return;switch(e.refValueType){case"date":case"time":case"datetime":break;default:return}e=e.value}if("number"==typeof e||"string"==typeof e){const t=a.coerceIntoValue(e);if(null!=t&&isFinite(t.valueOf()))return t}}export function getNewElementValue(e,a,t,r){return null!=e&&isFinite(e.valueOf())?{refValueType:a,format:t,display:r.format(e,Calendar.fullFormat),value:e.valueOf()}:void 0}

package/forms/elements/AutoComplete.js

@@ -1 +1 @@
-const autoCompletePropertyConstraints={delay:{default:300,minimum:1},minLength:{default:3,minimum:1}};export{autoCompletePropertyConstraints};
+export const autoCompletePropertyConstraints={delay:{default:300,minimum:1},minLength:{default:3,minimum:1}};

package/forms/elements/ButtonBar.d.ts

@@ -1,7 +1,10 @@
+import type { ItemAppearance } from "../FormDefinition";
 import type * as types from "./types";
 export interface ButtonBar extends types.ElementBase, types.EditableElement, types.ElementWithItems<Item> {
 }
 export interface Item extends types.ElementItemBase<any> {
+    /** Settings controlling the appearance of the item. */
+    readonly appearance?: ItemAppearance;
     /** Indicates if the item is a default. */
     readonly default?: boolean;
     /** Indicates if the element triggers validation when submitting. */

package/forms/elements/ButtonBar.js

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

package/forms/elements/CheckBox.js

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

package/forms/elements/CheckGroup.js

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

package/forms/elements/Custom.js

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

package/forms/elements/DatePicker.js

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

package/forms/elements/DateRangePicker.js

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

package/forms/elements/DateTimePicker.js

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

package/forms/elements/DropDownList.js

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

package/forms/elements/FilePicker.js

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

package/forms/elements/GeometryPicker.js

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

package/forms/elements/Header.js

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

package/forms/elements/HorizontalRule.js

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

package/forms/elements/Image.js

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

package/forms/elements/ItemPicker.js

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

package/forms/elements/ListBox.js

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

package/forms/elements/Number.js

@@ -1 +1 @@
-const numberFormatConfiguration={lowerBound:{default:void 0},upperBound:{default:void 0}};export{numberFormatConfiguration};
+export const numberFormatConfiguration={lowerBound:{default:void 0},upperBound:{default:void 0}};

package/forms/elements/NumberRangeSlider.js

@@ -1 +1 @@
-const numberFormatConfiguration={precision:{default:0,minimum:0}};export{numberFormatConfiguration};
+export const numberFormatConfiguration={precision:{default:0,minimum:0}};

package/forms/elements/NumberSlider.js

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