@lifesg/react-design-system 4.0.0-alpha.1 → 4.0.0-alpha.2

package/form/form-select.d.ts

@@ -1,2 +1,2 @@
 import type { FormInputSelectProps } from "./types";
-export declare const FormSelect: <T, V>({ label, errorMessage, id, "data-error-testid": errorTestId, "data-testid": testId, enableSearch, layoutType, mobileCols, tabletCols, desktopCols, xxsCols, xsCols, smCols, mdCols, lgCols, xlCols, xxlCols, variant, ...otherProps }: FormInputSelectProps<T, V>) => JSX.Element;
+export declare const FormSelect: <T, V>({ label, errorMessage, id, "data-error-testid": errorTestId, "data-testid": testId, enableSearch, layoutType, xxsCols, xsCols, smCols, mdCols, lgCols, xlCols, xxlCols, variant, ...otherProps }: FormInputSelectProps<T, V>) => JSX.Element;

package/form/form-select.js

@@ -1,2 +1,2 @@
-import{__rest as s}from"../_virtual/_tslib.js";import{jsx as l}from"react/jsx-runtime";import{useState as e}from"react";import{InputSelect as o}from"../input-select/input-select.js";import"../util/calendar-helper.js";import"../external/dayjs/dayjs.min.js";import{SimpleIdGenerator as t}from"../util/simple-id-generator.js";import"../util/string-helper.js";import{FormWrapper as r}from"./form-wrapper.js";const a=a=>{var{label:i,errorMessage:d,id:C,"data-error-testid":m,"data-testid":p,enableSearch:n=!1,layoutType:x,mobileCols:b,tabletCols:c,desktopCols:u,xxsCols:j,xsCols:g,smCols:f,mdCols:y,lgCols:h,xlCols:v,xxlCols:k,variant:M}=a,S=s(a,["label","errorMessage","id","data-error-testid","data-testid","enableSearch","layoutType","mobileCols","tabletCols","desktopCols","xxsCols","xsCols","smCols","mdCols","lgCols","xlCols","xxlCols","variant"]);const[T]=e((()=>`form-field-${t.generate()}`)),$=null!=C?C:T;return l(r,{id:$,"data-testid":p,label:i,errorMessage:d,"data-error-testid":m,disabled:S.disabled,layoutType:x,mobileCols:b,tabletCols:c,desktopCols:u,xxsCols:j,xsCols:g,smCols:f,mdCols:y,lgCols:h,xlCols:v,xxlCols:k,children:l(o,Object.assign({id:`${$}-base`,"data-testid":p?`${p}-base`:void 0,error:!!d,enableSearch:n,variant:M},S))})};export{a as FormSelect};
+import{__rest as r}from"../_virtual/_tslib.js";import{jsx as s}from"react/jsx-runtime";import{InputSelect as e}from"../input-select/input-select.js";import"../util/calendar-helper.js";import"../external/dayjs/dayjs.min.js";import"react";import{useId as l}from"../util/simple-id-generator.js";import"../util/string-helper.js";import"@react-aria/live-announcer";import{FormWrapper as t}from"./form-wrapper.js";const o=o=>{var{label:a,errorMessage:i,id:d,"data-error-testid":m,"data-testid":n,enableSearch:p=!1,layoutType:x,xxsCols:C,xsCols:c,smCols:u,mdCols:j,lgCols:b,xlCols:g,xxlCols:f,variant:y}=o,v=r(o,["label","errorMessage","id","data-error-testid","data-testid","enableSearch","layoutType","xxsCols","xsCols","smCols","mdCols","lgCols","xlCols","xxlCols","variant"]);const h=l(),M=null!=d?d:`form-field-${h}`;return s(t,{id:M,"data-testid":n,label:a,errorMessage:i,"data-error-testid":m,layoutType:x,xxsCols:C,xsCols:c,smCols:u,mdCols:j,lgCols:b,xlCols:g,xxlCols:f,children:s(e,Object.assign({id:`${M}-base`,"data-testid":n?`${n}-base`:void 0,error:!!i,enableSearch:p,variant:y},v))})};export{o as FormSelect};
 //# sourceMappingURL=form-select.js.map

package/form/form-select.js.map

@@ -1 +1 @@
-{"version":3,"file":"form-select.js","sources":["../../src/form/form-select.tsx"],"sourcesContent":["import { useState } from \"react\";\n\nimport { InputSelect } from \"../input-select\";\nimport { SimpleIdGenerator } from \"../util\";\nimport { FormWrapper } from \"./form-wrapper\";\nimport type { FormInputSelectProps } from \"./types\";\n\nexport const FormSelect = <T, V>({\n    label,\n    errorMessage,\n    id,\n    \"data-error-testid\": errorTestId,\n    \"data-testid\": testId,\n    enableSearch = false,\n    layoutType,\n    mobileCols,\n    tabletCols,\n    desktopCols,\n    xxsCols,\n    xsCols,\n    smCols,\n    mdCols,\n    lgCols,\n    xlCols,\n    xxlCols,\n    variant,\n    ...otherProps\n}: FormInputSelectProps<T, V>): JSX.Element => {\n    const [internalId] = useState(\n        () => `form-field-${SimpleIdGenerator.generate()}`\n    );\n    const inputId = id ?? internalId;\n    return (\n        <FormWrapper\n            id={inputId}\n            data-testid={testId}\n            label={label}\n            errorMessage={errorMessage}\n            data-error-testid={errorTestId}\n            disabled={otherProps.disabled}\n            layoutType={layoutType}\n            mobileCols={mobileCols}\n            tabletCols={tabletCols}\n            desktopCols={desktopCols}\n            xxsCols={xxsCols}\n            xsCols={xsCols}\n            smCols={smCols}\n            mdCols={mdCols}\n            lgCols={lgCols}\n            xlCols={xlCols}\n            xxlCols={xxlCols}\n        >\n            <InputSelect\n                id={`${inputId}-base`}\n                data-testid={testId ? `${testId}-base` : undefined}\n                error={!!errorMessage}\n                enableSearch={enableSearch}\n                variant={variant}\n                {...otherProps}\n            />\n        </FormWrapper>\n    );\n};\n"],"names":["FormSelect","_a","label","errorMessage","id","errorTestId","testId","enableSearch","layoutType","mobileCols","tabletCols","desktopCols","xxsCols","xsCols","smCols","mdCols","lgCols","xlCols","xxlCols","variant","otherProps","__rest","internalId","useState","SimpleIdGenerator","generate","inputId","_jsx","FormWrapper","disabled","children","InputSelect","Object","assign","undefined","error"],"mappings":"oZAOO,MAAMA,EAAoBC,QAAAC,MAC7BA,EAAKC,aACLA,EAAYC,GACZA,EACA,oBAAqBC,EACrB,cAAeC,EAAMC,aACrBA,GAAe,EAAKC,WACpBA,EAAUC,WACVA,EAAUC,WACVA,EAAUC,YACVA,EAAWC,QACXA,EAAOC,OACPA,EAAMC,OACNA,EAAMC,OACNA,EAAMC,OACNA,EAAMC,OACNA,EAAMC,QACNA,EAAOC,QACPA,KACGC,EAAUC,EAAApB,EAnBgB,CAAA,QAAA,eAAA,KAAA,oBAAA,cAAA,eAAA,aAAA,aAAA,aAAA,cAAA,UAAA,SAAA,SAAA,SAAA,SAAA,SAAA,UAAA,YAqB7B,MAAOqB,GAAcC,GACjB,IAAM,cAAcC,EAAkBC,eAEpCC,EAAUtB,QAAAA,EAAMkB,EACtB,OACIK,EAACC,EAAW,CACRxB,GAAIsB,EAAO,cACEpB,EACbJ,MAAOA,EACPC,aAAcA,EAAY,oBACPE,EACnBwB,SAAUT,EAAWS,SACrBrB,WAAYA,EACZC,WAAYA,EACZC,WAAYA,EACZC,YAAaA,EACbC,QAASA,EACTC,OAAQA,EACRC,OAAQA,EACRC,OAAQA,EACRC,OAAQA,EACRC,OAAQA,EACRC,QAASA,EAAOY,SAEhBH,EAACI,EAAWC,OAAAC,OAAA,CACR7B,GAAI,GAAGsB,SAAc,cACRpB,EAAS,GAAGA,cAAgB4B,EACzCC,QAAShC,EACTI,aAAcA,EACdY,QAASA,GACLC,KAEE"}
+{"version":3,"file":"form-select.js","sources":["../../src/form/form-select.tsx"],"sourcesContent":["import { InputSelect } from \"../input-select\";\nimport { useId } from \"../util\";\nimport { FormWrapper } from \"./form-wrapper\";\nimport type { FormInputSelectProps } from \"./types\";\n\nexport const FormSelect = <T, V>({\n    label,\n    errorMessage,\n    id,\n    \"data-error-testid\": errorTestId,\n    \"data-testid\": testId,\n    enableSearch = false,\n    layoutType,\n    xxsCols,\n    xsCols,\n    smCols,\n    mdCols,\n    lgCols,\n    xlCols,\n    xxlCols,\n    variant,\n    ...otherProps\n}: FormInputSelectProps<T, V>): JSX.Element => {\n    const internalId = useId();\n    const inputId = id ?? `form-field-${internalId}`;\n    return (\n        <FormWrapper\n            id={inputId}\n            data-testid={testId}\n            label={label}\n            errorMessage={errorMessage}\n            data-error-testid={errorTestId}\n            layoutType={layoutType}\n            xxsCols={xxsCols}\n            xsCols={xsCols}\n            smCols={smCols}\n            mdCols={mdCols}\n            lgCols={lgCols}\n            xlCols={xlCols}\n            xxlCols={xxlCols}\n        >\n            <InputSelect\n                id={`${inputId}-base`}\n                data-testid={testId ? `${testId}-base` : undefined}\n                error={!!errorMessage}\n                enableSearch={enableSearch}\n                variant={variant}\n                {...otherProps}\n            />\n        </FormWrapper>\n    );\n};\n"],"names":["FormSelect","_a","label","errorMessage","id","errorTestId","testId","enableSearch","layoutType","xxsCols","xsCols","smCols","mdCols","lgCols","xlCols","xxlCols","variant","otherProps","__rest","internalId","useId","inputId","_jsx","FormWrapper","InputSelect","undefined","error"],"mappings":"wZAKO,MAAMA,EAAoBC,IAAA,IAAAC,MAC7BA,EAAKC,aACLA,EAAYC,GACZA,EACA,oBAAqBC,EACrB,cAAeC,EAAMC,aACrBA,GAAe,EAAKC,WACpBA,EAAUC,QACVA,EAAOC,OACPA,EAAMC,OACNA,EAAMC,OACNA,EAAMC,OACNA,EAAMC,OACNA,EAAMC,QACNA,EAAOC,QACPA,GAAOf,EACJgB,EAAUC,EAAAjB,EAhBgB,wKAkB7B,MAAMkB,EAAaC,IACbC,EAAUjB,QAAAA,EAAM,cAAce,IACpC,OACIG,EAACC,GACGnB,GAAIiB,EAAO,cACEf,EACbJ,MAAOA,EACPC,aAAcA,EAAY,oBACPE,EACnBG,WAAYA,EACZC,QAASA,EACTC,OAAQA,EACRC,OAAQA,EACRC,OAAQA,EACRC,OAAQA,EACRC,OAAQA,EACRC,QAASA,WAETO,EAACE,iBACGpB,GAAI,GAAGiB,uBACMf,EAAS,GAAGA,cAAgBmB,EACzCC,QAASvB,EACTI,aAAcA,EACdS,QAASA,GACLC,KAEE"}

package/form/form-slider.d.ts

@@ -1,2 +1,2 @@
 import type { FormSliderProps } from "./types";
-export declare const FormSlider: ({ label, errorMessage, id, "data-error-testid": errorTestId, "data-testid": testId, layoutType, mobileCols, tabletCols, desktopCols, xxsCols, xsCols, smCols, mdCols, lgCols, xlCols, xxlCols, ...otherProps }: FormSliderProps) => JSX.Element;
+export declare const FormSlider: ({ label, errorMessage, id, "data-error-testid": errorTestId, "data-testid": testId, layoutType, xxsCols, xsCols, smCols, mdCols, lgCols, xlCols, xxlCols, ...otherProps }: FormSliderProps) => JSX.Element;

package/form/form-slider.js

@@ -1,2 +1,2 @@
-import{__rest as s}from"../_virtual/_tslib.js";import{jsx as l}from"react/jsx-runtime";import{InputSlider as o}from"../input-slider/input-slider.js";import{FormWrapper as e}from"./form-wrapper.js";const t=t=>{var{label:r,errorMessage:a,id:d="form-slider","data-error-testid":C,"data-testid":i,layoutType:m,mobileCols:x,tabletCols:p,desktopCols:b,xxsCols:u,xsCols:g,smCols:n,mdCols:f,lgCols:y,xlCols:j,xxlCols:c}=t,k=s(t,["label","errorMessage","id","data-error-testid","data-testid","layoutType","mobileCols","tabletCols","desktopCols","xxsCols","xsCols","smCols","mdCols","lgCols","xlCols","xxlCols"]);return l(e,{id:d,label:r,errorMessage:a,"data-error-testid":C,disabled:k.disabled,layoutType:m,mobileCols:x,tabletCols:p,desktopCols:b,xxsCols:u,xsCols:g,smCols:n,mdCols:f,lgCols:y,xlCols:j,xxlCols:c,children:l(o,Object.assign({id:`${d}-base`,"data-testid":i||d},k))})};export{t as FormSlider};
+import{__rest as s}from"../_virtual/_tslib.js";import{jsx as r}from"react/jsx-runtime";import{InputSlider as l}from"../input-slider/input-slider.js";import"../util/calendar-helper.js";import"../external/dayjs/dayjs.min.js";import"react";import{useId as o}from"../util/simple-id-generator.js";import"../util/string-helper.js";import"@react-aria/live-announcer";import{FormWrapper as t}from"./form-wrapper.js";const e=e=>{var{label:a,errorMessage:i,id:d,"data-error-testid":m,"data-testid":p,layoutType:x,xxsCols:C,xsCols:n,smCols:u,mdCols:j,lgCols:c,xlCols:g,xxlCols:y}=e,b=s(e,["label","errorMessage","id","data-error-testid","data-testid","layoutType","xxsCols","xsCols","smCols","mdCols","lgCols","xlCols","xxlCols"]);const f=o(),v=null!=d?d:`form-slider-${f}`;return r(t,{id:v,label:a,errorMessage:i,"data-testid":p,"data-error-testid":m,layoutType:x,xxsCols:C,xsCols:n,smCols:u,mdCols:j,lgCols:c,xlCols:g,xxlCols:y,children:r(l,Object.assign({id:`${v}-base`,"data-testid":p?`${p}-base`:void 0},b))})};export{e as FormSlider};
 //# sourceMappingURL=form-slider.js.map

package/form/form-slider.js.map

@@ -1 +1 @@
-{"version":3,"file":"form-slider.js","sources":["../../src/form/form-slider.tsx"],"sourcesContent":["import { InputSlider } from \"../input-slider\";\nimport { FormWrapper } from \"./form-wrapper\";\nimport type { FormSliderProps } from \"./types\";\n\nexport const FormSlider = ({\n    label,\n    errorMessage,\n    id = \"form-slider\",\n    \"data-error-testid\": errorTestId,\n    \"data-testid\": testId,\n    layoutType,\n    mobileCols,\n    tabletCols,\n    desktopCols,\n    xxsCols,\n    xsCols,\n    smCols,\n    mdCols,\n    lgCols,\n    xlCols,\n    xxlCols,\n    ...otherProps\n}: FormSliderProps): JSX.Element => {\n    return (\n        <FormWrapper\n            id={id}\n            label={label}\n            errorMessage={errorMessage}\n            data-error-testid={errorTestId}\n            disabled={otherProps.disabled}\n            layoutType={layoutType}\n            mobileCols={mobileCols}\n            tabletCols={tabletCols}\n            desktopCols={desktopCols}\n            xxsCols={xxsCols}\n            xsCols={xsCols}\n            smCols={smCols}\n            mdCols={mdCols}\n            lgCols={lgCols}\n            xlCols={xlCols}\n            xxlCols={xxlCols}\n        >\n            <InputSlider\n                id={`${id}-base`}\n                data-testid={testId || id}\n                {...otherProps}\n            />\n        </FormWrapper>\n    );\n};\n"],"names":["FormSlider","_a","label","errorMessage","id","errorTestId","testId","layoutType","mobileCols","tabletCols","desktopCols","xxsCols","xsCols","smCols","mdCols","lgCols","xlCols","xxlCols","otherProps","__rest","_jsx","FormWrapper","disabled","children","InputSlider","Object","assign"],"mappings":"qMAIO,MAAMA,EAAcC,IAAA,IAAAC,MACvBA,EAAKC,aACLA,EAAYC,GACZA,EAAK,cACL,oBAAqBC,EACrB,cAAeC,EAAMC,WACrBA,EAAUC,WACVA,EAAUC,WACVA,EAAUC,YACVA,EAAWC,QACXA,EAAOC,OACPA,EAAMC,OACNA,EAAMC,OACNA,EAAMC,OACNA,EAAMC,OACNA,EAAMC,QACNA,GAAOhB,EACJiB,EAAUC,EAAAlB,EAjBU,uLAmBvB,OACImB,EAACC,GACGjB,GAAIA,EACJF,MAAOA,EACPC,aAAcA,EAAY,oBACPE,EACnBiB,SAAUJ,EAAWI,SACrBf,WAAYA,EACZC,WAAYA,EACZC,WAAYA,EACZC,YAAaA,EACbC,QAASA,EACTC,OAAQA,EACRC,OAAQA,EACRC,OAAQA,EACRC,OAAQA,EACRC,OAAQA,EACRC,QAASA,EAAOM,SAEhBH,EAACI,EAAWC,OAAAC,OAAA,CACRtB,GAAI,GAAGA,SAAS,cACHE,GAAUF,GACnBc,KAEE"}
+{"version":3,"file":"form-slider.js","sources":["../../src/form/form-slider.tsx"],"sourcesContent":["import { InputSlider } from \"../input-slider\";\nimport { useId } from \"../util\";\nimport { FormWrapper } from \"./form-wrapper\";\nimport type { FormSliderProps } from \"./types\";\n\nexport const FormSlider = ({\n    label,\n    errorMessage,\n    id,\n    \"data-error-testid\": errorTestId,\n    \"data-testid\": testId,\n    layoutType,\n    xxsCols,\n    xsCols,\n    smCols,\n    mdCols,\n    lgCols,\n    xlCols,\n    xxlCols,\n    ...otherProps\n}: FormSliderProps): JSX.Element => {\n    const internalId = useId();\n    const inputId = id ?? `form-slider-${internalId}`;\n\n    return (\n        <FormWrapper\n            id={inputId}\n            label={label}\n            errorMessage={errorMessage}\n            data-testid={testId}\n            data-error-testid={errorTestId}\n            layoutType={layoutType}\n            xxsCols={xxsCols}\n            xsCols={xsCols}\n            smCols={smCols}\n            mdCols={mdCols}\n            lgCols={lgCols}\n            xlCols={xlCols}\n            xxlCols={xxlCols}\n        >\n            <InputSlider\n                id={`${inputId}-base`}\n                data-testid={testId ? `${testId}-base` : undefined}\n                {...otherProps}\n            />\n        </FormWrapper>\n    );\n};\n"],"names":["FormSlider","_a","label","errorMessage","id","errorTestId","testId","layoutType","xxsCols","xsCols","smCols","mdCols","lgCols","xlCols","xxlCols","otherProps","__rest","internalId","useId","inputId","_jsx","FormWrapper","children","InputSlider","Object","assign","undefined"],"mappings":"wZAKO,MAAMA,EAAcC,IAAA,IAAAC,MACvBA,EAAKC,aACLA,EAAYC,GACZA,EACA,oBAAqBC,EACrB,cAAeC,EAAMC,WACrBA,EAAUC,QACVA,EAAOC,OACPA,EAAMC,OACNA,EAAMC,OACNA,EAAMC,OACNA,EAAMC,OACNA,EAAMC,QACNA,GAAOb,EACJc,EAAUC,EAAAf,EAdU,+IAgBvB,MAAMgB,EAAaC,IACbC,EAAUf,QAAAA,EAAM,eAAea,IAErC,OACIG,EAACC,EAAW,CACRjB,GAAIe,EACJjB,MAAOA,EACPC,aAAcA,gBACDG,EAAM,oBACAD,EACnBE,WAAYA,EACZC,QAASA,EACTC,OAAQA,EACRC,OAAQA,EACRC,OAAQA,EACRC,OAAQA,EACRC,OAAQA,EACRC,QAASA,EAAOQ,SAEhBF,EAACG,EAAWC,OAAAC,OAAA,CACRrB,GAAI,GAAGe,uBACMb,EAAS,GAAGA,cAAgBoB,GACrCX,KAEE"}

package/form/form-textarea.js

@@ -1,2 +1,2 @@
-import{__rest as e}from"../_virtual/_tslib.js";import{jsxs as o,jsx as r,Fragment as s}from"react/jsx-runtime";import t,{useState as l,useEffect as a}from"react";import{TextareaBase as m}from"../input-textarea/textarea.js";import{TextareaCounter as i}from"../input-textarea/textarea-counter.js";import{ErrorIcon as C}from"./form-label.style.js";import{LabelContainer as d,ErrorMessageContainer as x,ErrorMessageLabel as n}from"./form-textarea.style.js";import{FormWrapper as p}from"./form-wrapper.js";const f=t.forwardRef(((t,f)=>{const{label:u,value:g,errorMessage:b,id:h="form-textarea","data-error-testid":c,"data-testid":j,onChange:y,layoutType:v,mobileCols:L,tabletCols:k,desktopCols:T,xxsCols:V,xsCols:w,smCols:M,mdCols:$,lgCols:_,xlCols:O,xxlCols:R,transformValue:q,prefix:z=""}=t,A=e(t,["label","value","errorMessage","id","data-error-testid","data-testid","onChange","layoutType","mobileCols","tabletCols","desktopCols","xxsCols","xsCols","smCols","mdCols","lgCols","xlCols","xxlCols","transformValue","prefix"]),[B,D]=l(g);a((()=>{D(g)}),[g]);return o(p,{id:h,label:u,disabled:A.disabled,layoutType:v,mobileCols:L,tabletCols:k,desktopCols:T,xxsCols:V,xsCols:w,smCols:M,mdCols:$,lgCols:_,xlCols:O,xxlCols:R,children:[r(m,Object.assign({id:`${h}-base`,"data-testid":j||h,value:B,error:!!b,onChange:e=>{const o=e.target.value;D(o),y&&y(e)},ref:f,prefix:z,transformValue:q},A)),b||A.maxLength?o(d,{children:[b&&o(x,{children:[r(C,{"aria-hidden":!0}),r(n,{"data-testid":c||(h?`${h}-error-message`:"error-message"),children:b})]}),A.maxLength&&r(i,{value:B,maxLength:A.maxLength,renderCustomCounter:A.renderCustomCounter})]}):r(s,{})]})}));export{f as FormTextarea};
+import{__rest as e}from"../_virtual/_tslib.js";import{jsxs as r,jsx as t,Fragment as s}from"react/jsx-runtime";import a,{useState as o,useEffect as l}from"react";import{TextareaBase as m}from"../input-textarea/textarea.js";import{TextareaCounter as i}from"../input-textarea/textarea-counter.js";import"../util/calendar-helper.js";import"../external/dayjs/dayjs.min.js";import{useId as n}from"../util/simple-id-generator.js";import"../util/string-helper.js";import"@react-aria/live-announcer";import{FormErrorMessage as d}from"./form-label.js";import{labelContainer as x,errorMessageContainer as C,errorMessageLabel as u}from"./form-textarea.styles.js";import{FormWrapper as p}from"./form-wrapper.js";const f=a.forwardRef(((a,f)=>{const{label:g,value:c,errorMessage:j,id:h,"data-error-testid":v,"data-testid":y,onChange:b,layoutType:L,xxsCols:$,xsCols:N,smCols:T,mdCols:V,lgCols:w,xlCols:M,xxlCols:_,transformValue:O,prefix:R="",renderCustomCounter:k}=a,q=e(a,["label","value","errorMessage","id","data-error-testid","data-testid","onChange","layoutType","xxsCols","xsCols","smCols","mdCols","lgCols","xlCols","xxlCols","transformValue","prefix","renderCustomCounter"]),z=n(),A=null!=h?h:`form-textarea-${z}`,[B,D]=o(c);l((()=>{D(c)}),[c]);return r(p,{id:A,"data-testid":y,label:g,layoutType:L,xxsCols:$,xsCols:N,smCols:T,mdCols:V,lgCols:w,xlCols:M,xxlCols:_,children:[t(m,Object.assign({id:`${A}-base`,"data-testid":y?`${y}-base`:void 0,value:B,error:!!j,onChange:e=>{const r=e.target.value;D(r),b&&b(e)},ref:f,prefix:R,transformValue:O},q)),j||q.maxLength?r("div",{className:x,children:[j&&t("div",{className:C,children:t(d,{className:u,"data-testid":v||(A?`${A}-error-message`:"error-message"),children:j})}),q.maxLength&&t(i,{value:B,maxLength:q.maxLength,renderCustomCounter:k})]}):t(s,{})]})}));export{f as FormTextarea};
 //# sourceMappingURL=form-textarea.js.map

package/form/form-textarea.js.map

@@ -1 +1 @@
-{"version":3,"file":"form-textarea.js","sources":["../../src/form/form-textarea.tsx"],"sourcesContent":["import React, { useEffect, useState } from \"react\";\n\nimport { TextareaBase } from \"../input-textarea/textarea\";\nimport { TextareaCounter } from \"../input-textarea/textarea-counter\";\nimport type { TextareaRef } from \"../input-textarea/types\";\nimport { ErrorIcon } from \"./form-label.style\";\nimport {\n    ErrorMessageContainer,\n    ErrorMessageLabel,\n    LabelContainer,\n} from \"./form-textarea.style\";\nimport { FormWrapper } from \"./form-wrapper\";\nimport type { FormTextareaProps } from \"./types\";\n\nconst FormTextareaComponent = (\n    props: FormTextareaProps,\n    ref: TextareaRef\n): JSX.Element => {\n    // =============================================================================\n    // CONST, STATE, REF\n    // =============================================================================\n    const {\n        label,\n        value,\n        errorMessage,\n        id = \"form-textarea\",\n        \"data-error-testid\": errorTestId,\n        \"data-testid\": testId,\n        onChange,\n        layoutType,\n        mobileCols,\n        tabletCols,\n        desktopCols,\n        xxsCols,\n        xsCols,\n        smCols,\n        mdCols,\n        lgCols,\n        xlCols,\n        xxlCols,\n        transformValue,\n        prefix = \"\",\n        ...otherProps\n    } = props;\n\n    const [stateValue, setStateValue] = useState<\n        string | number | readonly string[] | undefined\n    >(value);\n\n    // =============================================================================\n    // EFFECTS\n    // =============================================================================\n    useEffect(() => {\n        setStateValue(value);\n    }, [value]);\n\n    // =============================================================================\n    // HELPER FUNCTIONS\n    // =============================================================================\n\n    const getErrorTestMessageId = () => {\n        return errorTestId || (id ? `${id}-error-message` : \"error-message\");\n    };\n\n    // =============================================================================\n    // EVENT HANDLER\n    // =============================================================================\n    const handleChange = (event: React.ChangeEvent<HTMLTextAreaElement>) => {\n        const newValue = event.target.value;\n        setStateValue(newValue);\n        if (onChange) onChange(event);\n    };\n\n    // =============================================================================\n    // RENDER FUNCTIONS\n    // =============================================================================\n    const renderBottomLabels = () => {\n        if (!errorMessage && !otherProps.maxLength) return <></>;\n        return (\n            <LabelContainer>\n                {errorMessage && (\n                    <ErrorMessageContainer>\n                        <ErrorIcon aria-hidden />\n                        <ErrorMessageLabel\n                            data-testid={getErrorTestMessageId()}\n                        >\n                            {errorMessage}\n                        </ErrorMessageLabel>\n                    </ErrorMessageContainer>\n                )}\n                {otherProps.maxLength && (\n                    <TextareaCounter\n                        value={stateValue}\n                        maxLength={otherProps.maxLength}\n                        renderCustomCounter={otherProps.renderCustomCounter}\n                    />\n                )}\n            </LabelContainer>\n        );\n    };\n\n    return (\n        <FormWrapper\n            id={id}\n            label={label}\n            disabled={otherProps.disabled}\n            layoutType={layoutType}\n            mobileCols={mobileCols}\n            tabletCols={tabletCols}\n            desktopCols={desktopCols}\n            xxsCols={xxsCols}\n            xsCols={xsCols}\n            smCols={smCols}\n            mdCols={mdCols}\n            lgCols={lgCols}\n            xlCols={xlCols}\n            xxlCols={xxlCols}\n        >\n            <TextareaBase\n                id={`${id}-base`}\n                data-testid={testId || id}\n                value={stateValue}\n                error={!!errorMessage}\n                onChange={handleChange}\n                ref={ref}\n                prefix={prefix}\n                transformValue={transformValue}\n                {...otherProps}\n            />\n            {renderBottomLabels()}\n        </FormWrapper>\n    );\n};\n\nexport const FormTextarea = React.forwardRef(FormTextareaComponent);\n"],"names":["FormTextarea","React","forwardRef","props","ref","label","value","errorMessage","id","errorTestId","testId","onChange","layoutType","mobileCols","tabletCols","desktopCols","xxsCols","xsCols","smCols","mdCols","lgCols","xlCols","xxlCols","transformValue","prefix","otherProps","__rest","stateValue","setStateValue","useState","useEffect","_jsxs","FormWrapper","disabled","_jsx","TextareaBase","Object","assign","error","event","newValue","target","maxLength","LabelContainer","children","ErrorMessageContainer","ErrorIcon","ErrorMessageLabel","TextareaCounter","renderCustomCounter"],"mappings":"qfAcA,MAwHaA,EAAeC,EAAMC,YAxHJ,CAC1BC,EACAC,KAKA,MAAMC,MACFA,EAAKC,MACLA,EAAKC,aACLA,EAAYC,GACZA,EAAK,gBACL,oBAAqBC,EACrB,cAAeC,EAAMC,SACrBA,EAAQC,WACRA,EAAUC,WACVA,EAAUC,WACVA,EAAUC,YACVA,EAAWC,QACXA,EAAOC,OACPA,EAAMC,OACNA,EAAMC,OACNA,EAAMC,OACNA,EAAMC,OACNA,EAAMC,QACNA,EAAOC,eACPA,EAAcC,OACdA,EAAS,IAETrB,EADGsB,EAAUC,EACbvB,EAtBE,CAAA,QAAA,QAAA,eAAA,KAAA,oBAAA,cAAA,WAAA,aAAA,aAAA,aAAA,cAAA,UAAA,SAAA,SAAA,SAAA,SAAA,SAAA,UAAA,iBAAA,YAwBCwB,EAAYC,GAAiBC,EAElCvB,GAKFwB,GAAU,KACNF,EAActB,EAAM,GACrB,CAACA,IA+CJ,OACIyB,EAACC,EAAW,CACRxB,GAAIA,EACJH,MAAOA,EACP4B,SAAUR,EAAWQ,SACrBrB,WAAYA,EACZC,WAAYA,EACZC,WAAYA,EACZC,YAAaA,EACbC,QAASA,EACTC,OAAQA,EACRC,OAAQA,EACRC,OAAQA,EACRC,OAAQA,EACRC,OAAQA,EACRC,QAASA,YAETY,EAACC,EAAYC,OAAAC,OAAA,CACT7B,GAAI,GAAGA,SAAS,cACHE,GAAUF,EACvBF,MAAOqB,EACPW,QAAS/B,EACTI,SAxDU4B,IAClB,MAAMC,EAAWD,EAAME,OAAOnC,MAC9BsB,EAAcY,GACV7B,GAAUA,EAAS4B,EAAM,EAsDrBnC,IAAKA,EACLoB,OAAQA,EACRD,eAAgBA,GACZE,IAlDPlB,GAAiBkB,EAAWiB,UAE7BX,EAACY,EAAc,CAAAC,SAAA,CACVrC,GACGwB,EAACc,EAAqB,CAAAD,SAAA,CAClBV,EAACY,sBACDZ,EAACa,EAAiB,CAAA,cAtB3BtC,IAAgBD,EAAK,GAAGA,kBAAqB,0BAyB/BD,OAIZkB,EAAWiB,WACRR,EAACc,EAAe,CACZ1C,MAAOqB,EACPe,UAAWjB,EAAWiB,UACtBO,oBAAqBxB,EAAWwB,yBAjBGf,UAqDrC"}
+{"version":3,"file":"form-textarea.js","sources":["../../src/form/form-textarea.tsx"],"sourcesContent":["import React, { useEffect, useState } from \"react\";\n\nimport { TextareaBase } from \"../input-textarea/textarea\";\nimport { TextareaCounter } from \"../input-textarea/textarea-counter\";\nimport type { TextareaRef } from \"../input-textarea/types\";\nimport { useId } from \"../util\";\nimport { FormErrorMessage } from \"./form-label\";\nimport * as styles from \"./form-textarea.styles\";\nimport { FormWrapper } from \"./form-wrapper\";\nimport type { FormTextareaProps } from \"./types\";\n\nconst FormTextareaComponent = (\n    props: FormTextareaProps,\n    ref: TextareaRef\n): JSX.Element => {\n    // =============================================================================\n    // CONST, STATE, REF\n    // =============================================================================\n    const {\n        label,\n        value,\n        errorMessage,\n        id,\n        \"data-error-testid\": errorTestId,\n        \"data-testid\": testId,\n        onChange,\n        layoutType,\n        xxsCols,\n        xsCols,\n        smCols,\n        mdCols,\n        lgCols,\n        xlCols,\n        xxlCols,\n        transformValue,\n        prefix = \"\",\n        renderCustomCounter,\n        ...otherProps\n    } = props;\n\n    const internalId = useId();\n    const inputId = id ?? `form-textarea-${internalId}`;\n\n    const [stateValue, setStateValue] = useState<\n        string | number | readonly string[] | undefined\n    >(value);\n\n    // =============================================================================\n    // EFFECTS\n    // =============================================================================\n    useEffect(() => {\n        setStateValue(value);\n    }, [value]);\n\n    // =============================================================================\n    // HELPER FUNCTIONS\n    // =============================================================================\n\n    const getErrorTestMessageId = () => {\n        return (\n            errorTestId ||\n            (inputId ? `${inputId}-error-message` : \"error-message\")\n        );\n    };\n\n    // =============================================================================\n    // EVENT HANDLER\n    // =============================================================================\n    const handleChange = (event: React.ChangeEvent<HTMLTextAreaElement>) => {\n        const newValue = event.target.value;\n        setStateValue(newValue);\n        if (onChange) onChange(event);\n    };\n\n    // =============================================================================\n    // RENDER FUNCTIONS\n    // =============================================================================\n    const renderBottomLabels = () => {\n        if (!errorMessage && !otherProps.maxLength) return <></>;\n        return (\n            <div className={styles.labelContainer}>\n                {errorMessage && (\n                    <div className={styles.errorMessageContainer}>\n                        <FormErrorMessage\n                            className={styles.errorMessageLabel}\n                            data-testid={getErrorTestMessageId()}\n                        >\n                            {errorMessage}\n                        </FormErrorMessage>\n                    </div>\n                )}\n                {otherProps.maxLength && (\n                    <TextareaCounter\n                        value={stateValue}\n                        maxLength={otherProps.maxLength}\n                        renderCustomCounter={renderCustomCounter}\n                    />\n                )}\n            </div>\n        );\n    };\n\n    return (\n        <FormWrapper\n            id={inputId}\n            data-testid={testId}\n            label={label}\n            layoutType={layoutType}\n            xxsCols={xxsCols}\n            xsCols={xsCols}\n            smCols={smCols}\n            mdCols={mdCols}\n            lgCols={lgCols}\n            xlCols={xlCols}\n            xxlCols={xxlCols}\n        >\n            <TextareaBase\n                id={`${inputId}-base`}\n                data-testid={testId ? `${testId}-base` : undefined}\n                value={stateValue}\n                error={!!errorMessage}\n                onChange={handleChange}\n                ref={ref}\n                prefix={prefix}\n                transformValue={transformValue}\n                {...otherProps}\n            />\n            {renderBottomLabels()}\n        </FormWrapper>\n    );\n};\n\nexport const FormTextarea = React.forwardRef(FormTextareaComponent);\n"],"names":["FormTextarea","React","forwardRef","props","ref","label","value","errorMessage","id","errorTestId","testId","onChange","layoutType","xxsCols","xsCols","smCols","mdCols","lgCols","xlCols","xxlCols","transformValue","prefix","renderCustomCounter","otherProps","internalId","useId","inputId","stateValue","setStateValue","useState","useEffect","_jsxs","FormWrapper","children","_jsx","TextareaBase","Object","assign","undefined","error","event","newValue","target","maxLength","className","styles.labelContainer","styles.errorMessageContainer","FormErrorMessage","styles.errorMessageLabel","TextareaCounter"],"mappings":"4rBAWA,MAyHaA,EAAeC,EAAMC,YAzHJ,CAC1BC,EACAC,KAKA,MAAMC,MACFA,EAAKC,MACLA,EAAKC,aACLA,EAAYC,GACZA,EACA,oBAAqBC,EACrB,cAAeC,EAAMC,SACrBA,EAAQC,WACRA,EAAUC,QACVA,EAAOC,OACPA,EAAMC,OACNA,EAAMC,OACNA,EAAMC,OACNA,EAAMC,OACNA,EAAMC,QACNA,EAAOC,eACPA,EAAcC,OACdA,EAAS,GAAEC,oBACXA,GAEAnB,EADGoB,IACHpB,EApBE,CAAA,QAAA,QAAA,eAAA,KAAA,oBAAA,cAAA,WAAA,aAAA,UAAA,SAAA,SAAA,SAAA,SAAA,SAAA,UAAA,iBAAA,SAAA,wBAsBAqB,EAAaC,IACbC,EAAUlB,QAAAA,EAAM,iBAAiBgB,KAEhCG,EAAYC,GAAiBC,EAElCvB,GAKFwB,GAAU,KACNF,EAActB,EAAM,GACrB,CAACA,IAkDJ,OACIyB,EAACC,EAAW,CACRxB,GAAIkB,EAAO,cACEhB,EACbL,MAAOA,EACPO,WAAYA,EACZC,QAASA,EACTC,OAAQA,EACRC,OAAQA,EACRC,OAAQA,EACRC,OAAQA,EACRC,OAAQA,EACRC,QAASA,EAAOc,SAAA,CAEhBC,EAACC,EAAYC,OAAAC,OAAA,CACT7B,GAAI,GAAGkB,SAAc,cACRhB,EAAS,GAAGA,cAAgB4B,EACzChC,MAAOqB,EACPY,QAAShC,EACTI,SArDU6B,IAClB,MAAMC,EAAWD,EAAME,OAAOpC,MAC9BsB,EAAca,GACV9B,GAAUA,EAAS6B,EAAM,EAmDrBpC,IAAKA,EACLiB,OAAQA,EACRD,eAAgBA,GACZG,IA/CPhB,GAAiBgB,EAAWoB,UAE7BZ,EAAA,MAAA,CAAKa,UAAWC,EAAqBZ,SAAA,CAChC1B,GACG2B,EAAA,MAAA,CAAKU,UAAWE,EAA4Bb,SACxCC,EAACa,EAAgB,CACbH,UAAWI,EAAwB,cAxBnDvC,IACCiB,EAAU,GAAGA,kBAA0B,iBAwBYO,SAEnC1B,MAIZgB,EAAWoB,WACRT,EAACe,EAAe,CACZ3C,MAAOqB,EACPgB,UAAWpB,EAAWoB,UACtBrB,oBAAqBA,OAjBcY,UAkDrC"}

package/form/form-textarea.styles.d.ts

@@ -0,0 +1,3 @@
+export declare const labelContainer: import("@linaria/core").LinariaClassName;
+export declare const errorMessageContainer: import("@linaria/core").LinariaClassName;
+export declare const errorMessageLabel: import("@linaria/core").LinariaClassName;

package/form/form-textarea.styles.js

@@ -0,0 +1,2 @@
+import"./form-textarea.styles_3p9qoy.css";const e="l1g6v039",o="exxic43",t="ebp2a0d";export{o as errorMessageContainer,t as errorMessageLabel,e as labelContainer};
+//# sourceMappingURL=form-textarea.styles.js.map

package/form/form-textarea.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"form-textarea.styles.js","sources":["../../src/form/form-textarea.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { Spacing } from \"../theme\";\n\nexport const labelContainer = css`\n    display: flex;\n    justify-content: flex-end;\n    margin-top: ${Spacing[\"spacing-8\"]};\n`;\n\nexport const errorMessageContainer = css`\n    display: flex;\n    flex: 1;\n    margin-right: ${Spacing[\"spacing-12\"]};\n    gap: ${Spacing[\"spacing-4\"]};\n`;\n\nexport const errorMessageLabel = css`\n    margin-top: 0;\n`;\n"],"names":["labelContainer","errorMessageContainer","errorMessageLabel"],"mappings":"8DAIO,MAAMA,EAAc,WAMdC,EAAqB,UAOrBC,EAAiB"}

package/form/form-textarea.styles_3p9qoy.css

@@ -0,0 +1,3 @@
+.l1g6v039{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:end;-ms-flex-pack:end;-webkit-justify-content:flex-end;justify-content:flex-end;margin-top:var(--fds-spacing-8);}
+.exxic43{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex:1;-ms-flex:1;flex:1;margin-right:var(--fds-spacing-12);gap:var(--fds-spacing-4);}
+.ebp2a0d{margin-top:0;}

package/form/form-time-range-picker.d.ts

@@ -1,2 +1,2 @@
 import type { FormTimeRangePickerProps } from "./types";
-export declare const FormTimeRangePicker: ({ label, errorMessage, id, "data-error-testid": errorTestId, "data-testid": testId, layoutType, mobileCols, tabletCols, desktopCols, xxsCols, xsCols, smCols, mdCols, lgCols, xlCols, xxlCols, ...otherProps }: FormTimeRangePickerProps) => JSX.Element;
+export declare const FormTimeRangePicker: ({ label, errorMessage, id, "data-error-testid": errorTestId, "data-testid": testId, layoutType, xxsCols, xsCols, smCols, mdCols, lgCols, xlCols, xxlCols, ...otherProps }: FormTimeRangePickerProps) => JSX.Element;

package/form/form-time-range-picker.js

@@ -1,2 +1,2 @@
-import{__rest as s}from"../_virtual/_tslib.js";import{jsx as l}from"react/jsx-runtime";import{TimeRangePicker as o}from"../time-range-picker/time-range-picker.js";import{FormWrapper as e}from"./form-wrapper.js";const r=r=>{var{label:t,errorMessage:a,id:i="form-timepicker","data-error-testid":C,"data-testid":d,layoutType:m,mobileCols:x,tabletCols:p,desktopCols:b,xxsCols:g,xsCols:c,smCols:n,mdCols:f,lgCols:k,xlCols:u,xxlCols:y}=r,j=s(r,["label","errorMessage","id","data-error-testid","data-testid","layoutType","mobileCols","tabletCols","desktopCols","xxsCols","xsCols","smCols","mdCols","lgCols","xlCols","xxlCols"]);return l(e,{id:i,label:t,errorMessage:a,disabled:j.disabled,"data-error-testid":C,layoutType:m,mobileCols:x,tabletCols:p,desktopCols:b,xxsCols:g,xsCols:c,smCols:n,mdCols:f,lgCols:k,xlCols:u,xxlCols:y,children:l(o,Object.assign({id:`${i}-base`,"data-testid":d||i,error:!!a},j))})};export{r as FormTimeRangePicker};
+import{__rest as r}from"../_virtual/_tslib.js";import{jsx as s}from"react/jsx-runtime";import{TimeRangePicker as e}from"../time-range-picker/time-range-picker.js";import"../util/calendar-helper.js";import"../external/dayjs/dayjs.min.js";import"react";import{useId as o}from"../util/simple-id-generator.js";import"../util/string-helper.js";import"@react-aria/live-announcer";import{FormWrapper as l}from"./form-wrapper.js";const t=t=>{var{label:a,errorMessage:i,id:m,"data-error-testid":d,"data-testid":p,layoutType:x,xxsCols:C,xsCols:n,smCols:c,mdCols:g,lgCols:j,xlCols:u,xxlCols:y}=t,b=r(t,["label","errorMessage","id","data-error-testid","data-testid","layoutType","xxsCols","xsCols","smCols","mdCols","lgCols","xlCols","xxlCols"]);const f=o(),v=null!=m?m:`form-time-range-picker-${f}`;return s(l,{id:v,label:a,errorMessage:i,"data-error-testid":d,layoutType:x,xxsCols:C,xsCols:n,smCols:c,mdCols:g,lgCols:j,xlCols:u,xxlCols:y,children:s(e,Object.assign({id:`${v}-base`,"data-testid":p?`${p}-base`:void 0,error:!!i},b))})};export{t as FormTimeRangePicker};
 //# sourceMappingURL=form-time-range-picker.js.map

package/form/form-time-range-picker.js.map

@@ -1 +1 @@
-{"version":3,"file":"form-time-range-picker.js","sources":["../../src/form/form-time-range-picker.tsx"],"sourcesContent":["import { TimeRangePicker } from \"../time-range-picker\";\nimport { FormWrapper } from \"./form-wrapper\";\nimport type { FormTimeRangePickerProps } from \"./types\";\n\nexport const FormTimeRangePicker = ({\n    label,\n    errorMessage,\n    id = \"form-timepicker\",\n    \"data-error-testid\": errorTestId,\n    \"data-testid\": testId,\n    layoutType,\n    mobileCols,\n    tabletCols,\n    desktopCols,\n    xxsCols,\n    xsCols,\n    smCols,\n    mdCols,\n    lgCols,\n    xlCols,\n    xxlCols,\n    ...otherProps\n}: FormTimeRangePickerProps): JSX.Element => {\n    return (\n        <FormWrapper\n            id={id}\n            label={label}\n            errorMessage={errorMessage}\n            disabled={otherProps.disabled}\n            data-error-testid={errorTestId}\n            layoutType={layoutType}\n            mobileCols={mobileCols}\n            tabletCols={tabletCols}\n            desktopCols={desktopCols}\n            xxsCols={xxsCols}\n            xsCols={xsCols}\n            smCols={smCols}\n            mdCols={mdCols}\n            lgCols={lgCols}\n            xlCols={xlCols}\n            xxlCols={xxlCols}\n        >\n            <TimeRangePicker\n                id={`${id}-base`}\n                data-testid={testId || id}\n                error={!!errorMessage}\n                {...otherProps}\n            />\n        </FormWrapper>\n    );\n};\n"],"names":["FormTimeRangePicker","_a","label","errorMessage","id","errorTestId","testId","layoutType","mobileCols","tabletCols","desktopCols","xxsCols","xsCols","smCols","mdCols","lgCols","xlCols","xxlCols","otherProps","__rest","_jsx","FormWrapper","disabled","children","TimeRangePicker","Object","assign","error"],"mappings":"mNAIO,MAAMA,EAAuBC,IAAA,IAAAC,MAChCA,EAAKC,aACLA,EAAYC,GACZA,EAAK,kBACL,oBAAqBC,EACrB,cAAeC,EAAMC,WACrBA,EAAUC,WACVA,EAAUC,WACVA,EAAUC,YACVA,EAAWC,QACXA,EAAOC,OACPA,EAAMC,OACNA,EAAMC,OACNA,EAAMC,OACNA,EAAMC,OACNA,EAAMC,QACNA,GAAOhB,EACJiB,EAAUC,EAAAlB,EAjBmB,uLAmBhC,OACImB,EAACC,GACGjB,GAAIA,EACJF,MAAOA,EACPC,aAAcA,EACdmB,SAAUJ,EAAWI,6BACFjB,EACnBE,WAAYA,EACZC,WAAYA,EACZC,WAAYA,EACZC,YAAaA,EACbC,QAASA,EACTC,OAAQA,EACRC,OAAQA,EACRC,OAAQA,EACRC,OAAQA,EACRC,OAAQA,EACRC,QAASA,EAAOM,SAEhBH,EAACI,EAAeC,OAAAC,OAAA,CACZtB,GAAI,GAAGA,SAAS,cACHE,GAAUF,EACvBuB,QAASxB,GACLe,KAEE"}
+{"version":3,"file":"form-time-range-picker.js","sources":["../../src/form/form-time-range-picker.tsx"],"sourcesContent":["import { TimeRangePicker } from \"../time-range-picker\";\nimport { useId } from \"../util\";\nimport { FormWrapper } from \"./form-wrapper\";\nimport type { FormTimeRangePickerProps } from \"./types\";\n\nexport const FormTimeRangePicker = ({\n    label,\n    errorMessage,\n    id,\n    \"data-error-testid\": errorTestId,\n    \"data-testid\": testId,\n    layoutType,\n    xxsCols,\n    xsCols,\n    smCols,\n    mdCols,\n    lgCols,\n    xlCols,\n    xxlCols,\n    ...otherProps\n}: FormTimeRangePickerProps): JSX.Element => {\n    const internalId = useId();\n    const inputId = id ?? `form-time-range-picker-${internalId}`;\n    return (\n        <FormWrapper\n            id={inputId}\n            label={label}\n            errorMessage={errorMessage}\n            data-error-testid={errorTestId}\n            layoutType={layoutType}\n            xxsCols={xxsCols}\n            xsCols={xsCols}\n            smCols={smCols}\n            mdCols={mdCols}\n            lgCols={lgCols}\n            xlCols={xlCols}\n            xxlCols={xxlCols}\n        >\n            <TimeRangePicker\n                id={`${inputId}-base`}\n                data-testid={testId ? `${testId}-base` : undefined}\n                error={!!errorMessage}\n                {...otherProps}\n            />\n        </FormWrapper>\n    );\n};\n"],"names":["FormTimeRangePicker","_a","label","errorMessage","id","errorTestId","testId","layoutType","xxsCols","xsCols","smCols","mdCols","lgCols","xlCols","xxlCols","otherProps","__rest","internalId","useId","inputId","_jsx","FormWrapper","children","TimeRangePicker","undefined","error"],"mappings":"saAKO,MAAMA,EAAuBC,IAAA,IAAAC,MAChCA,EAAKC,aACLA,EAAYC,GACZA,EACA,oBAAqBC,EACrB,cAAeC,EAAMC,WACrBA,EAAUC,QACVA,EAAOC,OACPA,EAAMC,OACNA,EAAMC,OACNA,EAAMC,OACNA,EAAMC,OACNA,EAAMC,QACNA,GAAOb,EACJc,EAAUC,EAAAf,EAdmB,+IAgBhC,MAAMgB,EAAaC,IACbC,EAAUf,QAAAA,EAAM,0BAA0Ba,IAChD,OACIG,EAACC,EAAW,CACRjB,GAAIe,EACJjB,MAAOA,EACPC,aAAcA,EAAY,oBACPE,EACnBE,WAAYA,EACZC,QAASA,EACTC,OAAQA,EACRC,OAAQA,EACRC,OAAQA,EACRC,OAAQA,EACRC,OAAQA,EACRC,QAASA,EAAOQ,SAEhBF,EAACG,iBACGnB,GAAI,GAAGe,uBACMb,EAAS,GAAGA,cAAgBkB,EACzCC,QAAStB,GACLY,KAEE"}

package/form/form-timepicker.d.ts

@@ -1,2 +1,2 @@
 import type { FormTimepickerProps } from "./types";
-export declare const FormTimepicker: ({ label, errorMessage, id, "data-error-testid": errorTestId, "data-testid": testId, layoutType, mobileCols, tabletCols, desktopCols, xxsCols, xsCols, smCols, mdCols, lgCols, xlCols, xxlCols, ...otherProps }: FormTimepickerProps) => JSX.Element;
+export declare const FormTimepicker: ({ label, errorMessage, id, "data-error-testid": errorTestId, "data-testid": testId, layoutType, xxsCols, xsCols, smCols, mdCols, lgCols, xlCols, xxlCols, ...otherProps }: FormTimepickerProps) => JSX.Element;

package/form/form-timepicker.js

@@ -1,2 +1,2 @@
-import{__rest as s}from"../_virtual/_tslib.js";import{jsx as l}from"react/jsx-runtime";import{useState as o}from"react";import{Timepicker as e}from"../timepicker/timepicker.js";import"../util/calendar-helper.js";import"../external/dayjs/dayjs.min.js";import{SimpleIdGenerator as r}from"../util/simple-id-generator.js";import"../util/string-helper.js";import{FormWrapper as t}from"./form-wrapper.js";const i=i=>{var{label:a,errorMessage:d,id:m,"data-error-testid":C,"data-testid":p,layoutType:x,mobileCols:b,tabletCols:n,desktopCols:j,xxsCols:u,xsCols:c,smCols:g,mdCols:f,lgCols:y,xlCols:k,xxlCols:h}=i,v=s(i,["label","errorMessage","id","data-error-testid","data-testid","layoutType","mobileCols","tabletCols","desktopCols","xxsCols","xsCols","smCols","mdCols","lgCols","xlCols","xxlCols"]);const[M]=o((()=>`form-timepicker-input-${r.generate()}`)),T=null!=m?m:M;return l(t,{id:T,label:a,errorMessage:d,disabled:v.disabled,"data-error-testid":C,layoutType:x,mobileCols:b,tabletCols:n,desktopCols:j,xxsCols:u,xsCols:c,smCols:g,mdCols:f,lgCols:y,xlCols:k,xxlCols:h,children:l(e,Object.assign({id:`${T}-base`,"data-testid":p?`${p}-base`:void 0,error:!!d},v))})};export{i as FormTimepicker};
+import{__rest as r}from"../_virtual/_tslib.js";import{jsx as s}from"react/jsx-runtime";import{Timepicker as e}from"../timepicker/timepicker.js";import"../util/calendar-helper.js";import"../external/dayjs/dayjs.min.js";import"react";import{useId as o}from"../util/simple-id-generator.js";import"../util/string-helper.js";import"@react-aria/live-announcer";import{FormWrapper as l}from"./form-wrapper.js";const t=t=>{var{label:i,errorMessage:a,id:m,"data-error-testid":d,"data-testid":p,layoutType:x,xxsCols:C,xsCols:n,smCols:c,mdCols:u,lgCols:j,xlCols:g,xxlCols:y}=t,b=r(t,["label","errorMessage","id","data-error-testid","data-testid","layoutType","xxsCols","xsCols","smCols","mdCols","lgCols","xlCols","xxlCols"]);const f=o(),v=null!=m?m:`form-timepicker-input-${f}`;return s(l,{id:v,label:i,errorMessage:a,"data-error-testid":d,layoutType:x,xxsCols:C,xsCols:n,smCols:c,mdCols:u,lgCols:j,xlCols:g,xxlCols:y,children:s(e,Object.assign({id:`${v}-base`,"data-testid":p?`${p}-base`:void 0,error:!!a},b))})};export{t as FormTimepicker};
 //# sourceMappingURL=form-timepicker.js.map

package/form/form-timepicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"form-timepicker.js","sources":["../../src/form/form-timepicker.tsx"],"sourcesContent":["import { useState } from \"react\";\n\nimport { Timepicker } from \"../timepicker\";\nimport { SimpleIdGenerator } from \"../util\";\nimport { FormWrapper } from \"./form-wrapper\";\nimport type { FormTimepickerProps } from \"./types\";\n\nexport const FormTimepicker = ({\n    label,\n    errorMessage,\n    id,\n    \"data-error-testid\": errorTestId,\n    \"data-testid\": testId,\n    layoutType,\n    mobileCols,\n    tabletCols,\n    desktopCols,\n    xxsCols,\n    xsCols,\n    smCols,\n    mdCols,\n    lgCols,\n    xlCols,\n    xxlCols,\n    ...otherProps\n}: FormTimepickerProps): JSX.Element => {\n    const [internalId] = useState(\n        () => `form-timepicker-input-${SimpleIdGenerator.generate()}`\n    );\n    const inputId = id ?? internalId;\n\n    return (\n        <FormWrapper\n            id={inputId}\n            label={label}\n            errorMessage={errorMessage}\n            disabled={otherProps.disabled}\n            data-error-testid={errorTestId}\n            layoutType={layoutType}\n            mobileCols={mobileCols}\n            tabletCols={tabletCols}\n            desktopCols={desktopCols}\n            xxsCols={xxsCols}\n            xsCols={xsCols}\n            smCols={smCols}\n            mdCols={mdCols}\n            lgCols={lgCols}\n            xlCols={xlCols}\n            xxlCols={xxlCols}\n        >\n            <Timepicker\n                id={`${inputId}-base`}\n                data-testid={testId ? `${testId}-base` : undefined}\n                error={!!errorMessage}\n                {...otherProps}\n            />\n        </FormWrapper>\n    );\n};\n"],"names":["FormTimepicker","_a","label","errorMessage","id","errorTestId","testId","layoutType","mobileCols","tabletCols","desktopCols","xxsCols","xsCols","smCols","mdCols","lgCols","xlCols","xxlCols","otherProps","__rest","internalId","useState","SimpleIdGenerator","generate","inputId","_jsx","FormWrapper","disabled","children","Timepicker","Object","assign","undefined","error"],"mappings":"+YAOO,MAAMA,EAAkBC,IAAA,IAAAC,MAC3BA,EAAKC,aACLA,EAAYC,GACZA,EACA,oBAAqBC,EACrB,cAAeC,EAAMC,WACrBA,EAAUC,WACVA,EAAUC,WACVA,EAAUC,YACVA,EAAWC,QACXA,EAAOC,OACPA,EAAMC,OACNA,EAAMC,OACNA,EAAMC,OACNA,EAAMC,OACNA,EAAMC,QACNA,GAAOhB,EACJiB,EAAUC,EAAAlB,EAjBc,uLAmB3B,MAAOmB,GAAcC,GACjB,IAAM,yBAAyBC,EAAkBC,eAE/CC,EAAUpB,QAAAA,EAAMgB,EAEtB,OACIK,EAACC,EAAW,CACRtB,GAAIoB,EACJtB,MAAOA,EACPC,aAAcA,EACdwB,SAAUT,EAAWS,SAAQ,oBACVtB,EACnBE,WAAYA,EACZC,WAAYA,EACZC,WAAYA,EACZC,YAAaA,EACbC,QAASA,EACTC,OAAQA,EACRC,OAAQA,EACRC,OAAQA,EACRC,OAAQA,EACRC,OAAQA,EACRC,QAASA,EAAOW,SAEhBH,EAACI,EAAUC,OAAAC,OAAA,CACP3B,GAAI,GAAGoB,SAAc,cACRlB,EAAS,GAAGA,cAAgB0B,EACzCC,QAAS9B,GACLe,KAEE"}
+{"version":3,"file":"form-timepicker.js","sources":["../../src/form/form-timepicker.tsx"],"sourcesContent":["import { Timepicker } from \"../timepicker\";\nimport { useId } from \"../util\";\nimport { FormWrapper } from \"./form-wrapper\";\nimport type { FormTimepickerProps } from \"./types\";\n\nexport const FormTimepicker = ({\n    label,\n    errorMessage,\n    id,\n    \"data-error-testid\": errorTestId,\n    \"data-testid\": testId,\n    layoutType,\n    xxsCols,\n    xsCols,\n    smCols,\n    mdCols,\n    lgCols,\n    xlCols,\n    xxlCols,\n    ...otherProps\n}: FormTimepickerProps): JSX.Element => {\n    const internalId = useId();\n    const inputId = id ?? `form-timepicker-input-${internalId}`;\n\n    return (\n        <FormWrapper\n            id={inputId}\n            label={label}\n            errorMessage={errorMessage}\n            data-error-testid={errorTestId}\n            layoutType={layoutType}\n            xxsCols={xxsCols}\n            xsCols={xsCols}\n            smCols={smCols}\n            mdCols={mdCols}\n            lgCols={lgCols}\n            xlCols={xlCols}\n            xxlCols={xxlCols}\n        >\n            <Timepicker\n                id={`${inputId}-base`}\n                data-testid={testId ? `${testId}-base` : undefined}\n                error={!!errorMessage}\n                {...otherProps}\n            />\n        </FormWrapper>\n    );\n};\n"],"names":["FormTimepicker","_a","label","errorMessage","id","errorTestId","testId","layoutType","xxsCols","xsCols","smCols","mdCols","lgCols","xlCols","xxlCols","otherProps","__rest","internalId","useId","inputId","_jsx","FormWrapper","children","Timepicker","undefined","error"],"mappings":"mZAKO,MAAMA,EAAkBC,IAAA,IAAAC,MAC3BA,EAAKC,aACLA,EAAYC,GACZA,EACA,oBAAqBC,EACrB,cAAeC,EAAMC,WACrBA,EAAUC,QACVA,EAAOC,OACPA,EAAMC,OACNA,EAAMC,OACNA,EAAMC,OACNA,EAAMC,OACNA,EAAMC,QACNA,GAAOb,EACJc,EAAUC,EAAAf,EAdc,+IAgB3B,MAAMgB,EAAaC,IACbC,EAAUf,QAAAA,EAAM,yBAAyBa,IAE/C,OACIG,EAACC,EAAW,CACRjB,GAAIe,EACJjB,MAAOA,EACPC,aAAcA,EAAY,oBACPE,EACnBE,WAAYA,EACZC,QAASA,EACTC,OAAQA,EACRC,OAAQA,EACRC,OAAQA,EACRC,OAAQA,EACRC,OAAQA,EACRC,QAASA,EAAOQ,SAEhBF,EAACG,iBACGnB,GAAI,GAAGe,uBACMb,EAAS,GAAGA,cAAgBkB,EACzCC,QAAStB,GACLY,KAEE"}

package/form/form-unit-number-input.d.ts

@@ -1,2 +1,2 @@
 import type { FormUnitNumberInputProps } from "./types";
-export declare const FormUnitNumberInput: ({ label, errorMessage, id, "data-error-testid": errorTestId, "data-testid": testId, layoutType, mobileCols, tabletCols, desktopCols, xxsCols, xsCols, smCols, mdCols, lgCols, xlCols, xxlCols, ...otherProps }: FormUnitNumberInputProps) => JSX.Element;
+export declare const FormUnitNumberInput: ({ label, errorMessage, id, "data-error-testid": errorTestId, "data-testid": testId, layoutType, xxsCols, xsCols, smCols, mdCols, lgCols, xlCols, xxlCols, ...otherProps }: FormUnitNumberInputProps) => JSX.Element;

package/form/form-unit-number-input.js

@@ -1,2 +1,2 @@
-import{__rest as s}from"../_virtual/_tslib.js";import{jsx as l}from"react/jsx-runtime";import{useState as o}from"react";import{UnitNumberInput as e}from"../unit-number/unit-number-input.js";import"../util/calendar-helper.js";import"../external/dayjs/dayjs.min.js";import{SimpleIdGenerator as t}from"../util/simple-id-generator.js";import"../util/string-helper.js";import{FormWrapper as r}from"./form-wrapper.js";const a=a=>{var{label:i,errorMessage:d,id:m,"data-error-testid":C,"data-testid":p,layoutType:b,mobileCols:n,tabletCols:x,desktopCols:u,xxsCols:j,xsCols:g,smCols:y,mdCols:f,lgCols:c,xlCols:$,xxlCols:h}=a,k=s(a,["label","errorMessage","id","data-error-testid","data-testid","layoutType","mobileCols","tabletCols","desktopCols","xxsCols","xsCols","smCols","mdCols","lgCols","xlCols","xxlCols"]);const[v]=o((()=>`form-unit-number-input-${t.generate()}`)),M=null!=m?m:v;return l(r,{id:M,"data-testid":p,label:i,errorMessage:d,"data-error-testid":C,disabled:k.disabled,layoutType:b,mobileCols:n,tabletCols:x,desktopCols:u,xxsCols:j,xsCols:g,smCols:y,mdCols:f,lgCols:c,xlCols:$,xxlCols:h,children:l(e,Object.assign({id:`${M}-base`,"data-testid":p?`${p}-base`:void 0,"aria-labelledby":`${M}-label`,error:!!d},k))})};export{a as FormUnitNumberInput};
+import{__rest as r}from"../_virtual/_tslib.js";import{jsx as s}from"react/jsx-runtime";import{UnitNumberInput as l}from"../unit-number/unit-number-input.js";import"../util/calendar-helper.js";import"../external/dayjs/dayjs.min.js";import"react";import{useId as t}from"../util/simple-id-generator.js";import"../util/string-helper.js";import"@react-aria/live-announcer";import{FormWrapper as e}from"./form-wrapper.js";const o=o=>{var{label:a,errorMessage:i,id:m,"data-error-testid":d,"data-testid":n,layoutType:p,xxsCols:x,xsCols:C,smCols:u,mdCols:b,lgCols:j,xlCols:c,xxlCols:g}=o,y=r(o,["label","errorMessage","id","data-error-testid","data-testid","layoutType","xxsCols","xsCols","smCols","mdCols","lgCols","xlCols","xxlCols"]);const f=t(),v=null!=m?m:`form-unit-number-input-${f}`;return s(e,{id:v,"data-testid":n,label:a,errorMessage:i,"data-error-testid":d,layoutType:p,xxsCols:x,xsCols:C,smCols:u,mdCols:b,lgCols:j,xlCols:c,xxlCols:g,children:s(l,Object.assign({id:`${v}-base`,"data-testid":n?`${n}-base`:void 0,"aria-labelledby":`${v}-label`,error:!!i},y))})};export{o as FormUnitNumberInput};
 //# sourceMappingURL=form-unit-number-input.js.map

package/form/form-unit-number-input.js.map

@@ -1 +1 @@
-{"version":3,"file":"form-unit-number-input.js","sources":["../../src/form/form-unit-number-input.tsx"],"sourcesContent":["import { useState } from \"react\";\n\nimport { UnitNumberInput } from \"../unit-number\";\nimport { SimpleIdGenerator } from \"../util\";\nimport { FormWrapper } from \"./form-wrapper\";\nimport type { FormUnitNumberInputProps } from \"./types\";\n\nexport const FormUnitNumberInput = ({\n    label,\n    errorMessage,\n    id,\n    \"data-error-testid\": errorTestId,\n    \"data-testid\": testId,\n    layoutType,\n    mobileCols,\n    tabletCols,\n    desktopCols,\n    xxsCols,\n    xsCols,\n    smCols,\n    mdCols,\n    lgCols,\n    xlCols,\n    xxlCols,\n    ...otherProps\n}: FormUnitNumberInputProps): JSX.Element => {\n    const [internalId] = useState(\n        () => `form-unit-number-input-${SimpleIdGenerator.generate()}`\n    );\n    const inputId = id ?? internalId;\n    return (\n        <FormWrapper\n            id={inputId}\n            data-testid={testId}\n            label={label}\n            errorMessage={errorMessage}\n            data-error-testid={errorTestId}\n            disabled={otherProps.disabled}\n            layoutType={layoutType}\n            mobileCols={mobileCols}\n            tabletCols={tabletCols}\n            desktopCols={desktopCols}\n            xxsCols={xxsCols}\n            xsCols={xsCols}\n            smCols={smCols}\n            mdCols={mdCols}\n            lgCols={lgCols}\n            xlCols={xlCols}\n            xxlCols={xxlCols}\n        >\n            <UnitNumberInput\n                id={`${inputId}-base`}\n                data-testid={testId ? `${testId}-base` : undefined}\n                aria-labelledby={`${inputId}-label`}\n                error={!!errorMessage}\n                {...otherProps}\n            />\n        </FormWrapper>\n    );\n};\n"],"names":["FormUnitNumberInput","_a","label","errorMessage","id","errorTestId","testId","layoutType","mobileCols","tabletCols","desktopCols","xxsCols","xsCols","smCols","mdCols","lgCols","xlCols","xxlCols","otherProps","__rest","internalId","useState","SimpleIdGenerator","generate","inputId","_jsx","FormWrapper","disabled","children","UnitNumberInput","undefined","error"],"mappings":"4ZAOO,MAAMA,EAAuBC,IAAA,IAAAC,MAChCA,EAAKC,aACLA,EAAYC,GACZA,EACA,oBAAqBC,EACrB,cAAeC,EAAMC,WACrBA,EAAUC,WACVA,EAAUC,WACVA,EAAUC,YACVA,EAAWC,QACXA,EAAOC,OACPA,EAAMC,OACNA,EAAMC,OACNA,EAAMC,OACNA,EAAMC,OACNA,EAAMC,QACNA,GAAOhB,EACJiB,EAAUC,EAAAlB,EAjBmB,uLAmBhC,MAAOmB,GAAcC,GACjB,IAAM,0BAA0BC,EAAkBC,eAEhDC,EAAUpB,QAAAA,EAAMgB,EACtB,OACIK,EAACC,EAAW,CACRtB,GAAIoB,EAAO,cACElB,EACbJ,MAAOA,EACPC,aAAcA,EAAY,oBACPE,EACnBsB,SAAUT,EAAWS,SACrBpB,WAAYA,EACZC,WAAYA,EACZC,WAAYA,EACZC,YAAaA,EACbC,QAASA,EACTC,OAAQA,EACRC,OAAQA,EACRC,OAAQA,EACRC,OAAQA,EACRC,OAAQA,EACRC,QAASA,EAAOW,SAEhBH,EAACI,iBACGzB,GAAI,GAAGoB,SAAc,cACRlB,EAAS,GAAGA,cAAgBwB,EAAS,kBACjC,GAAGN,UACpBO,QAAS5B,GACLe,KAEE"}
+{"version":3,"file":"form-unit-number-input.js","sources":["../../src/form/form-unit-number-input.tsx"],"sourcesContent":["import { UnitNumberInput } from \"../unit-number\";\nimport { useId } from \"../util\";\nimport { FormWrapper } from \"./form-wrapper\";\nimport type { FormUnitNumberInputProps } from \"./types\";\n\nexport const FormUnitNumberInput = ({\n    label,\n    errorMessage,\n    id,\n    \"data-error-testid\": errorTestId,\n    \"data-testid\": testId,\n    layoutType,\n    xxsCols,\n    xsCols,\n    smCols,\n    mdCols,\n    lgCols,\n    xlCols,\n    xxlCols,\n    ...otherProps\n}: FormUnitNumberInputProps): JSX.Element => {\n    const internalId = useId();\n    const inputId = id ?? `form-unit-number-input-${internalId}`;\n    return (\n        <FormWrapper\n            id={inputId}\n            data-testid={testId}\n            label={label}\n            errorMessage={errorMessage}\n            data-error-testid={errorTestId}\n            layoutType={layoutType}\n            xxsCols={xxsCols}\n            xsCols={xsCols}\n            smCols={smCols}\n            mdCols={mdCols}\n            lgCols={lgCols}\n            xlCols={xlCols}\n            xxlCols={xxlCols}\n        >\n            <UnitNumberInput\n                id={`${inputId}-base`}\n                data-testid={testId ? `${testId}-base` : undefined}\n                aria-labelledby={`${inputId}-label`}\n                error={!!errorMessage}\n                {...otherProps}\n            />\n        </FormWrapper>\n    );\n};\n"],"names":["FormUnitNumberInput","_a","label","errorMessage","id","errorTestId","testId","layoutType","xxsCols","xsCols","smCols","mdCols","lgCols","xlCols","xxlCols","otherProps","__rest","internalId","useId","inputId","_jsx","FormWrapper","UnitNumberInput","undefined","error"],"mappings":"gaAKO,MAAMA,EAAuBC,IAAA,IAAAC,MAChCA,EAAKC,aACLA,EAAYC,GACZA,EACA,oBAAqBC,EACrB,cAAeC,EAAMC,WACrBA,EAAUC,QACVA,EAAOC,OACPA,EAAMC,OACNA,EAAMC,OACNA,EAAMC,OACNA,EAAMC,OACNA,EAAMC,QACNA,GAAOb,EACJc,EAAUC,EAAAf,EAdmB,+IAgBhC,MAAMgB,EAAaC,IACbC,EAAUf,QAAAA,EAAM,0BAA0Ba,IAChD,OACIG,EAACC,GACGjB,GAAIe,EAAO,cACEb,EACbJ,MAAOA,EACPC,aAAcA,sBACKE,EACnBE,WAAYA,EACZC,QAASA,EACTC,OAAQA,EACRC,OAAQA,EACRC,OAAQA,EACRC,OAAQA,EACRC,OAAQA,EACRC,QAASA,WAETM,EAACE,iBACGlB,GAAI,GAAGe,uBACMb,EAAS,GAAGA,cAAgBiB,EAAS,kBACjC,GAAGJ,UACpBK,QAASrB,GACLY,KAEE"}

package/form/form-wrapper.d.ts

@@ -4,4 +4,4 @@
  *
  */
 import type { FormWrapperProps } from "./types";
-export declare const FormWrapper: ({ label, errorMessage: eRaw, id, disabled, children, layoutType, mobileCols, tabletCols, desktopCols, xxsCols, xsCols, smCols, mdCols, lgCols, xlCols, xxlCols, "data-testid": testId, "data-error-testid": errorTestId, }: FormWrapperProps) => JSX.Element;
+export declare const FormWrapper: ({ label, errorMessage: eRaw, id, children, layoutType, xxsCols, xsCols, smCols, mdCols, lgCols, xlCols, xxlCols, "data-testid": testId, "data-error-testid": errorTestId, }: FormWrapperProps) => JSX.Element;

package/form/form-wrapper.js

@@ -1,2 +1,2 @@
-import{jsxs as e,jsx as l}from"react/jsx-runtime";import{useState as r,Children as s,cloneElement as t}from"react";import"../util/calendar-helper.js";import"../external/dayjs/dayjs.min.js";import{SimpleIdGenerator as o}from"../util/simple-id-generator.js";import"../util/string-helper.js";import{FormLabel as i}from"./form-label.js";import{ErrorMessageContainer as a,ErrorIcon as d,ErrorMessage as n}from"./form-label.style.js";import{Container as m,ColDivContainer as b,V2_ColDivContainer as c}from"./form-wrapper.style.js";const p=({label:p,errorMessage:u,id:C,disabled:g,children:x,layoutType:f,mobileCols:j,tabletCols:h,desktopCols:y,xxsCols:v,xsCols:$,smCols:w,mdCols:k,lgCols:F,xlCols:O,xxlCols:B,"data-testid":I,"data-error-testid":M})=>{const T=!f&&(j||h||y)?"v2-grid":!f&&(v||$||w||k||F||O||B)?"grid":f||"flex",q="string"==typeof u?u.trim():u,[z]=r((()=>o.generate())),A=`${null!=C?C:z}-label`,D=`${null!=C?C:z}-label-subtitle`,E=`${null!=C?C:z}-error-message`;const G=(e=>{switch(e){case"v2-grid":return c;case"grid":return b;case"flex":return m}})(T);return e(G,Object.assign({"data-testid":I},(e=>{switch(e){case"v2-grid":return{mobileCols:j,tabletCols:h,desktopCols:y};case"grid":return{xxsCols:v,xsCols:$,smCols:w,mdCols:k,lgCols:F,xlCols:O,xxlCols:B};case"flex":return}})(T),{children:[p&&l(i,"string"==typeof p?{htmlFor:`${C}-base`,"data-testid":C?`${C}-label`:"form-label",id:A,disabled:g,children:p}:Object.assign({htmlFor:`${C}-base`,"data-testid":C?`${C}-label`:"form-label",id:A,disabled:g},p)),(()=>{const e={"aria-invalid":!!u,"aria-describedby":[q?E:void 0,"object"==typeof p&&(null==p?void 0:p.subtitle)?D:void 0].filter(Boolean).join(" ")||void 0,"aria-labelledby":p?A:void 0};return s.map(x,(l=>t(l,e)))})(),q&&e(a,{children:[l(d,{"aria-hidden":!0}),l(n,{id:E,tabIndex:0,"data-testid":null!=M?M:C?`${C}-error-message`:"error-message",children:q})]})]}))};export{p as FormWrapper};
+import{jsxs as e,jsx as r}from"react/jsx-runtime";import{Children as l,cloneElement as s}from"react";import{ColDiv as t}from"../layout/col-div.js";import"../util/calendar-helper.js";import"../external/dayjs/dayjs.min.js";import{useId as o}from"../util/simple-id-generator.js";import"../util/string-helper.js";import"@react-aria/live-announcer";import{FormErrorMessage as i,FormLabel as a}from"./form-label.js";import{container as d}from"./form-wrapper.styles.js";const n=({label:n,errorMessage:m,id:c,children:p,layoutType:b,xxsCols:u,xsCols:x,smCols:f,mdCols:g,lgCols:j,xlCols:C,xxlCols:y,"data-testid":h,"data-error-testid":v})=>{const $=!b&&(u||x||f||g||j||C||y)?"grid":b||"flex",w="string"==typeof m?m.trim():m,F=o(),O=`${null!=c?c:F}-label`,B=`${null!=c?c:F}-label-subtitle`,I=`${null!=c?c:F}-error-message`;const M=(e=>{switch(e){case"grid":return t;case"flex":return"div"}})($);return e(M,Object.assign({className:d,"data-testid":h},(e=>{switch(e){case"grid":return{xxsCols:u,xsCols:x,smCols:f,mdCols:g,lgCols:j,xlCols:C,xxlCols:y};case"flex":return}})($),{children:[n&&r(a,"string"==typeof n?{htmlFor:`${c}-base`,"data-testid":c?`${c}-label`:"form-label",id:O,children:n}:Object.assign({htmlFor:`${c}-base`,"data-testid":c?`${c}-label`:"form-label",id:O},n)),(()=>{const e={"aria-invalid":!!m,"aria-describedby":[w?I:void 0,"object"==typeof n&&(null==n?void 0:n.subtitle)?B:void 0].filter(Boolean).join(" ")||void 0,"aria-labelledby":n?O:void 0};return l.map(p,(r=>s(r,e)))})(),w&&r(i,{id:I,tabIndex:0,"data-testid":null!=v?v:c?`${c}-error-message`:"error-message",children:w})]}))};export{n as FormWrapper};
 //# sourceMappingURL=form-wrapper.js.map

package/form/form-wrapper.js.map

@@ -1 +1 @@
-{"version":3,"file":"form-wrapper.js","sources":["../../src/form/form-wrapper.tsx"],"sourcesContent":["/**\n * This is a SUPPORTING component\n * (Do not include in the main export)\n *\n */\n\nimport type { ComponentType } from \"react\";\nimport { Children, cloneElement, useState } from \"react\";\n\nimport { SimpleIdGenerator } from \"../util\";\nimport { FormLabel } from \"./form-label\";\nimport {\n    ErrorIcon,\n    ErrorMessage,\n    ErrorMessageContainer,\n} from \"./form-label.style\";\nimport {\n    ColDivContainer,\n    Container,\n    V2_ColDivContainer,\n} from \"./form-wrapper.style\";\nimport type { FormElementLayoutType, FormWrapperProps } from \"./types\";\n\nexport const FormWrapper = ({\n    label,\n    errorMessage: eRaw,\n    id,\n    disabled,\n    children,\n    layoutType,\n    mobileCols,\n    tabletCols,\n    desktopCols,\n    xxsCols,\n    xsCols,\n    smCols,\n    mdCols,\n    lgCols,\n    xlCols,\n    xxlCols,\n    \"data-testid\": testId,\n    \"data-error-testid\": errorTestId,\n}: FormWrapperProps): JSX.Element => {\n    // =============================================================================\n    // CONST, STATE, REFS\n    // =============================================================================\n    const updatedLayoutType = getLayoutType();\n    const errorMessage = typeof eRaw === \"string\" ? eRaw.trim() : eRaw;\n    const [internalId] = useState(() => SimpleIdGenerator.generate());\n    const labelId = `${id ?? internalId}-label`; // matches FormLabel\n    const subtitleId = `${id ?? internalId}-label-subtitle`; // matches FormLabel\n    const errorMessageId = `${id ?? internalId}-error-message`;\n\n    // =============================================================================\n    // HELPER FUNCTIONS\n    // =============================================================================\n\n    const isInvalidState = (): boolean => {\n        return !!eRaw;\n    };\n\n    const hasSubtitleLabel = (): boolean => {\n        return typeof label === \"object\" && !!label?.subtitle;\n    };\n\n    const getAriaDescribedBy = (): string | undefined => {\n        return (\n            [\n                errorMessage ? errorMessageId : undefined,\n                hasSubtitleLabel() ? subtitleId : undefined,\n            ]\n                .filter(Boolean)\n                .join(\" \") || undefined\n        );\n    };\n\n    function getLayoutType(): FormElementLayoutType {\n        if (!layoutType && (mobileCols || tabletCols || desktopCols)) {\n            return \"v2-grid\";\n        } else if (\n            !layoutType &&\n            (xxsCols ||\n                xsCols ||\n                smCols ||\n                mdCols ||\n                lgCols ||\n                xlCols ||\n                xxlCols)\n        ) {\n            return \"grid\";\n        } else if (!layoutType) {\n            return \"flex\";\n        } else {\n            return layoutType;\n        }\n    }\n\n    const getContainerLayoutProps = (layoutType: FormElementLayoutType) => {\n        switch (layoutType) {\n            case \"v2-grid\":\n                return {\n                    mobileCols,\n                    tabletCols,\n                    desktopCols,\n                };\n            case \"grid\":\n                return {\n                    xxsCols,\n                    xsCols,\n                    smCols,\n                    mdCols,\n                    lgCols,\n                    xlCols,\n                    xxlCols,\n                };\n            case \"flex\":\n                return undefined;\n        }\n    };\n\n    const getContainerComponent = (\n        layoutType: FormElementLayoutType\n    ): ComponentType => {\n        switch (layoutType) {\n            case \"v2-grid\":\n                return V2_ColDivContainer;\n            case \"grid\":\n                return ColDivContainer;\n            case \"flex\":\n                return Container;\n        }\n    };\n\n    // =============================================================================\n    // RENDER FUNCTIONS\n    // =============================================================================\n\n    const renderFormLabel = (): JSX.Element => {\n        if (typeof label === \"string\") {\n            return (\n                <FormLabel\n                    htmlFor={`${id}-base`}\n                    // FIXME: kept for backwards-compatibility\n                    // in most cases data-testid should be separate from id\n                    data-testid={id ? `${id}-label` : \"form-label\"}\n                    id={labelId}\n                    disabled={disabled}\n                >\n                    {label}\n                </FormLabel>\n            );\n        }\n        return (\n            <FormLabel\n                htmlFor={`${id}-base`}\n                data-testid={id ? `${id}-label` : \"form-label\"}\n                id={labelId}\n                disabled={disabled}\n                {...label}\n            />\n        );\n    };\n\n    const renderChildren = (): JSX.Element | JSX.Element[] => {\n        const ariaState = {\n            \"aria-invalid\": isInvalidState(),\n            \"aria-describedby\": getAriaDescribedBy(),\n            \"aria-labelledby\": label ? labelId : undefined,\n        };\n        return Children.map(children, (child) =>\n            cloneElement(child, ariaState)\n        );\n    };\n\n    const ContainerComponent = getContainerComponent(updatedLayoutType);\n\n    return (\n        <ContainerComponent\n            data-testid={testId}\n            {...getContainerLayoutProps(updatedLayoutType)}\n        >\n            {label && renderFormLabel()}\n            {renderChildren()}\n            {errorMessage && (\n                <ErrorMessageContainer>\n                    <ErrorIcon aria-hidden />\n                    <ErrorMessage\n                        id={errorMessageId}\n                        tabIndex={0}\n                        data-testid={\n                            errorTestId ??\n                            // FIXME: kept for backwards-compatibility\n                            // in most cases data-testid should be separate from id\n                            (id ? `${id}-error-message` : \"error-message\")\n                        }\n                    >\n                        {errorMessage}\n                    </ErrorMessage>\n                </ErrorMessageContainer>\n            )}\n        </ContainerComponent>\n    );\n};\n"],"names":["FormWrapper","label","errorMessage","eRaw","id","disabled","children","layoutType","mobileCols","tabletCols","desktopCols","xxsCols","xsCols","smCols","mdCols","lgCols","xlCols","xxlCols","testId","errorTestId","updatedLayoutType","trim","internalId","useState","SimpleIdGenerator","generate","labelId","subtitleId","errorMessageId","ContainerComponent","V2_ColDivContainer","ColDivContainer","Container","getContainerComponent","_jsxs","Object","assign","getContainerLayoutProps","_jsx","FormLabel","htmlFor","ariaState","undefined","subtitle","filter","Boolean","join","Children","map","child","cloneElement","renderChildren","ErrorMessageContainer","ErrorIcon","ErrorMessage","tabIndex"],"mappings":"mhBAuBaA,EAAc,EACvBC,QACAC,aAAcC,EACdC,KACAC,WACAC,WACAC,aACAC,aACAC,aACAC,cACAC,UACAC,SACAC,SACAC,SACAC,SACAC,SACAC,UACA,cAAeC,EACf,oBAAqBC,MAKrB,MAAMC,GA+BGb,IAAeC,GAAcC,GAAcC,GACrC,WAENH,IACAI,GACGC,GACAC,GACAC,GACAC,GACAC,GACAC,GAEG,OACCV,GACD,OA5CTL,EAA+B,iBAATC,EAAoBA,EAAKkB,OAASlB,GACvDmB,GAAcC,GAAS,IAAMC,EAAkBC,aAChDC,EAAU,GAAGtB,QAAAA,EAAMkB,UACnBK,EAAa,GAAGvB,QAAAA,EAAMkB,mBACtBM,EAAiB,GAAGxB,QAAAA,EAAMkB,kBA8ChC,MA6EMO,EAtDwB,CAC1BtB,IAEA,OAAQA,GACJ,IAAK,UACD,OAAOuB,EACX,IAAK,OACD,OAAOC,EACX,IAAK,OACD,OAAOC,IA6CQC,CAAsBb,GAEjD,OACIc,EAACL,EAAkBM,OAAAC,OAAA,CAAA,cACFlB,GAjFW,CAACX,IAC7B,OAAQA,GACJ,IAAK,UACD,MAAO,CACHC,aACAC,aACAC,eAER,IAAK,OACD,MAAO,CACHC,UACAC,SACAC,SACAC,SACAC,SACAC,SACAC,WAER,IAAK,OACD,SA+DAoB,CAAwBjB,cAE3BnB,GAzCGqC,EAACC,EAFY,iBAAVtC,EAEO,CACNuC,QAAS,GAAGpC,SAAS,cAGRA,EAAK,GAAGA,UAAa,aAClCA,GAAIsB,EACJrB,SAAUA,EAAQC,SAEjBL,GAKCkC,OAAAC,OAAA,CACNI,QAAS,GAAGpC,SAAS,cACRA,EAAK,GAAGA,UAAa,aAClCA,GAAIsB,EACJrB,SAAUA,GACNJ,IAKO,MACnB,MAAMwC,EAAY,CACd,iBA3GKtC,EA4GL,mBAnGA,CACID,EAAe0B,OAAiBc,EANhB,iBAAVzC,IAAwBA,aAAK,EAALA,EAAO0C,UAOhBhB,OAAae,GAEjCE,OAAOC,SACPC,KAAK,WAAQJ,EA+FlB,kBAAmBzC,EAAQyB,OAAUgB,GAEzC,OAAOK,EAASC,IAAI1C,GAAW2C,GAC3BC,EAAaD,EAAOR,IACvB,EAWIU,GACAjD,GACGgC,EAACkB,EAAqB,CAAA9C,SAAA,CAClBgC,EAACe,EAAS,CAAA,eAAA,IACVf,EAACgB,GACGlD,GAAIwB,EACJ2B,SAAU,EAAC,cAEPpC,QAAAA,EAGCf,EAAK,GAAGA,kBAAqB,yBAGjCF,UAII"}
+{"version":3,"file":"form-wrapper.js","sources":["../../src/form/form-wrapper.tsx"],"sourcesContent":["/**\n * This is a SUPPORTING component\n * (Do not include in the main export)\n *\n */\n\nimport type { ElementType } from \"react\";\nimport { Children, cloneElement } from \"react\";\n\nimport { ColDiv } from \"../layout/col-div\";\nimport { useId } from \"../util\";\nimport { FormErrorMessage, FormLabel } from \"./form-label\";\nimport * as styles from \"./form-wrapper.styles\";\nimport type { FormElementLayoutType, FormWrapperProps } from \"./types\";\n\nexport const FormWrapper = ({\n    label,\n    errorMessage: eRaw,\n    id,\n    children,\n    layoutType,\n    xxsCols,\n    xsCols,\n    smCols,\n    mdCols,\n    lgCols,\n    xlCols,\n    xxlCols,\n    \"data-testid\": testId,\n    \"data-error-testid\": errorTestId,\n}: FormWrapperProps): JSX.Element => {\n    // =============================================================================\n    // CONST, STATE, REFS\n    // =============================================================================\n    const updatedLayoutType = getLayoutType();\n    const errorMessage = typeof eRaw === \"string\" ? eRaw.trim() : eRaw;\n    const internalId = useId();\n    const labelId = `${id ?? internalId}-label`; // matches FormLabel\n    const subtitleId = `${id ?? internalId}-label-subtitle`; // matches FormLabel\n    const errorMessageId = `${id ?? internalId}-error-message`;\n\n    // =============================================================================\n    // HELPER FUNCTIONS\n    // =============================================================================\n\n    const isInvalidState = (): boolean => {\n        return !!eRaw;\n    };\n\n    const hasSubtitleLabel = (): boolean => {\n        return typeof label === \"object\" && !!label?.subtitle;\n    };\n\n    const getAriaDescribedBy = (): string | undefined => {\n        return (\n            [\n                errorMessage ? errorMessageId : undefined,\n                hasSubtitleLabel() ? subtitleId : undefined,\n            ]\n                .filter(Boolean)\n                .join(\" \") || undefined\n        );\n    };\n\n    function getLayoutType(): FormElementLayoutType {\n        if (\n            !layoutType &&\n            (xxsCols ||\n                xsCols ||\n                smCols ||\n                mdCols ||\n                lgCols ||\n                xlCols ||\n                xxlCols)\n        ) {\n            return \"grid\";\n        } else if (!layoutType) {\n            return \"flex\";\n        } else {\n            return layoutType;\n        }\n    }\n\n    const getContainerLayoutProps = (layoutType: FormElementLayoutType) => {\n        switch (layoutType) {\n            case \"grid\":\n                return {\n                    xxsCols,\n                    xsCols,\n                    smCols,\n                    mdCols,\n                    lgCols,\n                    xlCols,\n                    xxlCols,\n                };\n            case \"flex\":\n                return undefined;\n        }\n    };\n\n    const getContainerComponent = (\n        layoutType: FormElementLayoutType\n    ): ElementType => {\n        switch (layoutType) {\n            case \"grid\":\n                return ColDiv;\n            case \"flex\":\n                return \"div\";\n        }\n    };\n\n    // =============================================================================\n    // RENDER FUNCTIONS\n    // =============================================================================\n\n    const renderFormLabel = (): JSX.Element => {\n        if (typeof label === \"string\") {\n            return (\n                <FormLabel\n                    htmlFor={`${id}-base`}\n                    // FIXME: kept for backwards-compatibility\n                    // in most cases data-testid should be separate from id\n                    data-testid={id ? `${id}-label` : \"form-label\"}\n                    id={labelId}\n                >\n                    {label}\n                </FormLabel>\n            );\n        }\n        return (\n            <FormLabel\n                htmlFor={`${id}-base`}\n                data-testid={id ? `${id}-label` : \"form-label\"}\n                id={labelId}\n                {...label}\n            />\n        );\n    };\n\n    const renderChildren = (): JSX.Element | JSX.Element[] => {\n        const ariaState = {\n            \"aria-invalid\": isInvalidState(),\n            \"aria-describedby\": getAriaDescribedBy(),\n            \"aria-labelledby\": label ? labelId : undefined,\n        };\n        return Children.map(children, (child) =>\n            cloneElement(child, ariaState)\n        );\n    };\n\n    const ContainerComponent = getContainerComponent(updatedLayoutType);\n\n    return (\n        <ContainerComponent\n            className={styles.container}\n            data-testid={testId}\n            {...getContainerLayoutProps(updatedLayoutType)}\n        >\n            {label && renderFormLabel()}\n            {renderChildren()}\n            {errorMessage && (\n                <FormErrorMessage\n                    id={errorMessageId}\n                    tabIndex={0}\n                    data-testid={\n                        errorTestId ??\n                        // FIXME: kept for backwards-compatibility\n                        // in most cases data-testid should be separate from id\n                        (id ? `${id}-error-message` : \"error-message\")\n                    }\n                >\n                    {errorMessage}\n                </FormErrorMessage>\n            )}\n        </ContainerComponent>\n    );\n};\n"],"names":["FormWrapper","label","errorMessage","eRaw","id","children","layoutType","xxsCols","xsCols","smCols","mdCols","lgCols","xlCols","xxlCols","testId","errorTestId","updatedLayoutType","trim","internalId","useId","labelId","subtitleId","errorMessageId","ContainerComponent","ColDiv","getContainerComponent","_jsxs","className","styles.container","getContainerLayoutProps","_jsx","FormLabel","htmlFor","Object","assign","ariaState","undefined","subtitle","filter","Boolean","join","Children","map","child","cloneElement","renderChildren","FormErrorMessage","tabIndex"],"mappings":"+cAeO,MAAMA,EAAc,EACvBC,QACAC,aAAcC,EACdC,KACAC,WACAC,aACAC,UACAC,SACAC,SACAC,SACAC,SACAC,SACAC,UACA,cAAeC,EACf,oBAAqBC,MAKrB,MAAMC,GAgCGV,IACAC,GACGC,GACAC,GACAC,GACAC,GACAC,GACAC,GAEG,OACCP,GACD,OA1CTJ,EAA+B,iBAATC,EAAoBA,EAAKc,OAASd,EACxDe,EAAaC,IACbC,EAAU,GAAGhB,QAAAA,EAAMc,UACnBG,EAAa,GAAGjB,QAAAA,EAAMc,mBACtBI,EAAiB,GAAGlB,QAAAA,EAAMc,kBA4ChC,MAmEMK,EAlDwB,CAC1BjB,IAEA,OAAQA,GACJ,IAAK,OACD,OAAOkB,EACX,IAAK,OACD,MAAO,QA2CQC,CAAsBT,GAEjD,OACIU,EAACH,iBACGI,UAAWC,gBACEd,GAxEW,CAACR,IAC7B,OAAQA,GACJ,IAAK,OACD,MAAO,CACHC,UACAC,SACAC,SACAC,SACAC,SACAC,SACAC,WAER,IAAK,OACD,SA4DAgB,CAAwBb,GAAkB,CAAAX,SAAA,CAE7CJ,GAxCG6B,EAACC,EAFY,iBAAV9B,EAEO,CACN+B,QAAS,GAAG5B,SAAS,cAGRA,EAAK,GAAGA,UAAa,aAClCA,GAAIgB,EAAOf,SAEVJ,GAKCgC,OAAAC,OAAA,CACNF,QAAS,GAAG5B,SAAS,cACRA,EAAK,GAAGA,UAAa,aAClCA,GAAIgB,GACAnB,IAKO,MACnB,MAAMkC,EAAY,CACd,iBA/FKhC,EAgGL,mBAvFA,CACID,EAAeoB,OAAiBc,EANhB,iBAAVnC,IAAwBA,aAAK,EAALA,EAAOoC,UAOhBhB,OAAae,GAEjCE,OAAOC,SACPC,KAAK,WAAQJ,EAmFlB,kBAAmBnC,EAAQmB,OAAUgB,GAEzC,OAAOK,EAASC,IAAIrC,GAAWsC,GAC3BC,EAAaD,EAAOR,IACvB,EAYIU,GACA3C,GACG4B,EAACgB,GACG1C,GAAIkB,EACJyB,SAAU,EAAC,cAEPhC,QAAAA,EAGCX,EAAK,GAAGA,kBAAqB,gBAAgBC,SAGjDH,OAGQ"}

package/form/form-wrapper.styles.d.ts

@@ -0,0 +1 @@
+export declare const container: import("@linaria/core").LinariaClassName;

package/form/form-wrapper.styles.js

@@ -0,0 +1,2 @@
+import"./form-wrapper.styles_199rslu.css";const r="c10mmo3e";export{r as container};
+//# sourceMappingURL=form-wrapper.styles.js.map

package/form/form-wrapper.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"form-wrapper.styles.js","sources":["../../src/form/form-wrapper.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { Spacing } from \"../theme\";\n\nexport const container = css`\n    display: flex;\n    flex-direction: column;\n\n    &:not(:last-child) {\n        margin-bottom: ${Spacing[\"spacing-32\"]};\n    }\n`;\n"],"names":["container"],"mappings":"8DAIO,MAAMA,EAAS"}

package/form/form-wrapper.styles_199rslu.css

@@ -0,0 +1 @@
+.c10mmo3e{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}.c10mmo3e:not(:last-child){margin-bottom:var(--fds-spacing-32);}

package/form/index.d.ts

@@ -1,26 +1,26 @@
 export declare const Form: {
-    DateInput: ({ label, errorMessage, id, "data-error-testid": errorTestId, "data-testid": testId, layoutType, mobileCols, tabletCols, desktopCols, xxsCols, xsCols, smCols, mdCols, lgCols, xlCols, xxlCols, ...otherProps }: import("./types").FormDateInputProps) => JSX.Element;
-    DateRangeInput: ({ label, errorMessage, id, "data-error-testid": errorTestId, "data-testid": testId, layoutType, mobileCols, tabletCols, desktopCols, xxsCols, xsCols, smCols, mdCols, lgCols, xlCols, xxlCols, ...otherProps }: import("./types").FormDateRangeInputProps) => JSX.Element;
+    DateInput: ({ label, errorMessage, id, "data-error-testid": errorTestId, "data-testid": testId, layoutType, xxsCols, xsCols, smCols, mdCols, lgCols, xlCols, xxlCols, ...otherProps }: import("./types").FormDateInputProps) => JSX.Element;
+    DateRangeInput: ({ label, errorMessage, id, "data-error-testid": errorTestId, "data-testid": testId, layoutType, xxsCols, xsCols, smCols, mdCols, lgCols, xlCols, xxlCols, ...otherProps }: import("./types").FormDateRangeInputProps) => JSX.Element;
     ESignature: (props: import("./types").FormESignatureProps) => import("react/jsx-runtime").JSX.Element;
-    HistogramSlider: ({ label, errorMessage, id, "data-error-testid": errorTestId, "data-testid": testId, layoutType, mobileCols, tabletCols, desktopCols, xxsCols, xsCols, smCols, mdCols, lgCols, xlCols, xxlCols, ...otherProps }: import("./types").FormHistogramSliderProps) => JSX.Element;
+    HistogramSlider: ({ label, errorMessage, id, "data-error-testid": errorTestId, "data-testid": testId, layoutType, xxsCols, xsCols, smCols, mdCols, lgCols, xlCols, xxlCols, ...otherProps }: import("./types").FormHistogramSliderProps) => JSX.Element;
     Input: (props: import("./types").FormInputProps & import("react").RefAttributes<HTMLInputElement>) => React.ReactElement | null;
     InputGroup: <T, V>(props: import("./types").FormInputGroupProps<T, V> & import("react").RefAttributes<HTMLInputElement>) => React.ReactElement | null;
     MaskedInput: (props: import("./types").FormMaskedInputProps & import("react").RefAttributes<HTMLInputElement>) => React.ReactElement | null;
     Label: ({ id, children, addon, subtitle, "data-testid": testId, className, style, ...otherProps }: import("./types").FormLabelProps) => JSX.Element;
-    MultiSelect: <T, V>({ label, errorMessage, id, "data-error-testid": errorTestId, "data-testid": testId, enableSearch, layoutType, mobileCols, tabletCols, desktopCols, xxsCols, xsCols, smCols, mdCols, lgCols, xlCols, xxlCols, variant, ...otherProps }: import("./types").FormMultiSelectProps<T, V>) => JSX.Element;
-    NestedSelect: <V1, V2, V3>({ label, errorMessage, id, "data-error-testid": errorTestId, "data-testid": testId, layoutType, mobileCols, tabletCols, desktopCols, xxsCols, xsCols, smCols, mdCols, lgCols, xlCols, xxlCols, ...otherProps }: import("./types").FormNestedSelectProps<V1, V2, V3>) => JSX.Element;
-    NestedMultiSelect: <V1, V2, V3>({ label, errorMessage, id, "data-error-testid": errorTestId, "data-testid": testId, layoutType, mobileCols, tabletCols, desktopCols, xxsCols, xsCols, smCols, mdCols, lgCols, xlCols, xxlCols, ...otherProps }: import("./types").FormNestedMultiSelectProps<V1, V2, V3>) => JSX.Element;
-    Select: <T, V>({ label, errorMessage, id, "data-error-testid": errorTestId, "data-testid": testId, enableSearch, layoutType, mobileCols, tabletCols, desktopCols, xxsCols, xsCols, smCols, mdCols, lgCols, xlCols, xxlCols, variant, ...otherProps }: import("./types").FormInputSelectProps<T, V>) => JSX.Element;
-    SelectHistogram: ({ label, errorMessage, id, "data-error-testid": errorTestId, "data-testid": testId, layoutType, mobileCols, tabletCols, desktopCols, xxsCols, xsCols, smCols, mdCols, lgCols, xlCols, xxlCols, histogramSlider, ...otherProps }: import("./types").FormSelectHistogramProps) => JSX.Element;
-    Slider: ({ label, errorMessage, id, "data-error-testid": errorTestId, "data-testid": testId, layoutType, mobileCols, tabletCols, desktopCols, xxsCols, xsCols, smCols, mdCols, lgCols, xlCols, xxlCols, ...otherProps }: import("./types").FormSliderProps) => JSX.Element;
-    RangeSlider: ({ label, errorMessage, id, "data-error-testid": errorTestId, "data-testid": testId, layoutType, mobileCols, tabletCols, desktopCols, xxsCols, xsCols, smCols, mdCols, lgCols, xlCols, xxlCols, ...otherProps }: import("./types").FormRangeSliderProps) => JSX.Element;
-    RangeSelect: <T, V>({ label, errorMessage, id, "data-error-testid": errorTestId, "data-testid": testId, enableSearch, layoutType, mobileCols, tabletCols, desktopCols, xxsCols, xsCols, smCols, mdCols, lgCols, xlCols, xxlCols, ...otherProps }: import("./types").FormInputRangeSelectProps<T, V>) => JSX.Element;
+    MultiSelect: <T, V>({ label, errorMessage, id, "data-error-testid": errorTestId, "data-testid": testId, enableSearch, layoutType, xxsCols, xsCols, smCols, mdCols, lgCols, xlCols, xxlCols, variant, ...otherProps }: import("./types").FormMultiSelectProps<T, V>) => JSX.Element;
+    NestedSelect: <V1, V2, V3>({ label, errorMessage, id, "data-error-testid": errorTestId, "data-testid": testId, layoutType, xxsCols, xsCols, smCols, mdCols, lgCols, xlCols, xxlCols, ...otherProps }: import("./types").FormNestedSelectProps<V1, V2, V3>) => JSX.Element;
+    NestedMultiSelect: <V1, V2, V3>({ label, errorMessage, id, "data-error-testid": errorTestId, "data-testid": testId, layoutType, xxsCols, xsCols, smCols, mdCols, lgCols, xlCols, xxlCols, ...otherProps }: import("./types").FormNestedMultiSelectProps<V1, V2, V3>) => JSX.Element;
+    Select: <T, V>({ label, errorMessage, id, "data-error-testid": errorTestId, "data-testid": testId, enableSearch, layoutType, xxsCols, xsCols, smCols, mdCols, lgCols, xlCols, xxlCols, variant, ...otherProps }: import("./types").FormInputSelectProps<T, V>) => JSX.Element;
+    SelectHistogram: ({ label, errorMessage, id, "data-error-testid": errorTestId, "data-testid": testId, layoutType, xxsCols, xsCols, smCols, mdCols, lgCols, xlCols, xxlCols, histogramSlider, ...otherProps }: import("./types").FormSelectHistogramProps) => JSX.Element;
+    Slider: ({ label, errorMessage, id, "data-error-testid": errorTestId, "data-testid": testId, layoutType, xxsCols, xsCols, smCols, mdCols, lgCols, xlCols, xxlCols, ...otherProps }: import("./types").FormSliderProps) => JSX.Element;
+    RangeSlider: ({ label, errorMessage, id, "data-error-testid": errorTestId, "data-testid": testId, layoutType, xxsCols, xsCols, smCols, mdCols, lgCols, xlCols, xxlCols, ...otherProps }: import("./types").FormRangeSliderProps) => JSX.Element;
+    RangeSelect: <T, V>({ label, errorMessage, id, "data-error-testid": errorTestId, "data-testid": testId, enableSearch, layoutType, xxsCols, xsCols, smCols, mdCols, lgCols, xlCols, xxlCols, ...otherProps }: import("./types").FormInputRangeSelectProps<T, V>) => JSX.Element;
     Textarea: (props: import("./types").FormTextareaProps & import("react").RefAttributes<HTMLTextAreaElement>) => React.ReactElement | null;
-    Timepicker: ({ label, errorMessage, id, "data-error-testid": errorTestId, "data-testid": testId, layoutType, mobileCols, tabletCols, desktopCols, xxsCols, xsCols, smCols, mdCols, lgCols, xlCols, xxlCols, ...otherProps }: import("./types").FormTimepickerProps) => JSX.Element;
-    TimeRangePicker: ({ label, errorMessage, id, "data-error-testid": errorTestId, "data-testid": testId, layoutType, mobileCols, tabletCols, desktopCols, xxsCols, xsCols, smCols, mdCols, lgCols, xlCols, xxlCols, ...otherProps }: import("./types").FormTimeRangePickerProps) => JSX.Element;
-    CustomField: ({ id, "data-error-testid": errorTestId, children, ...otherProps }: import("./types").FormCustomFieldProps) => JSX.Element;
-    UnitNumberInput: ({ label, errorMessage, id, "data-error-testid": errorTestId, "data-testid": testId, layoutType, mobileCols, tabletCols, desktopCols, xxsCols, xsCols, smCols, mdCols, lgCols, xlCols, xxlCols, ...otherProps }: import("./types").FormUnitNumberInputProps) => JSX.Element;
-    PhoneNumberInput: ({ label, errorMessage, id, "data-error-testid": errorTestId, "data-testid": testId, layoutType, mobileCols, tabletCols, desktopCols, xxsCols, xsCols, smCols, mdCols, lgCols, xlCols, xxlCols, ...otherProps }: import("./types").FormPhoneNumberInputProps) => JSX.Element;
-    PredictiveTextInput: <T, V>({ label, errorMessage, id, "data-error-testid": errorTestId, "data-testid": testId, layoutType, mobileCols, tabletCols, desktopCols, xxsCols, xsCols, smCols, mdCols, lgCols, xlCols, xxlCols, ...otherProps }: import("./types").FormPredictiveTextInputProps<T, V>) => JSX.Element;
-    OtpVerification: ({ label, id, "data-error-testid": errorTestId, "data-testid": testId, layoutType, mobileCols, tabletCols, desktopCols, xxsCols, xsCols, smCols, mdCols, lgCols, xlCols, xxlCols, ...otherProps }: import("../otp-verification").FormOtpVerificationProps) => JSX.Element;
+    Timepicker: ({ label, errorMessage, id, "data-error-testid": errorTestId, "data-testid": testId, layoutType, xxsCols, xsCols, smCols, mdCols, lgCols, xlCols, xxlCols, ...otherProps }: import("./types").FormTimepickerProps) => JSX.Element;
+    TimeRangePicker: ({ label, errorMessage, id, "data-error-testid": errorTestId, "data-testid": testId, layoutType, xxsCols, xsCols, smCols, mdCols, lgCols, xlCols, xxlCols, ...otherProps }: import("./types").FormTimeRangePickerProps) => JSX.Element;
+    CustomField: ({ id, "data-error-testid": errorTestId, "data-testid": testId, children, ...otherProps }: import("./types").FormCustomFieldProps) => JSX.Element;
+    UnitNumberInput: ({ label, errorMessage, id, "data-error-testid": errorTestId, "data-testid": testId, layoutType, xxsCols, xsCols, smCols, mdCols, lgCols, xlCols, xxlCols, ...otherProps }: import("./types").FormUnitNumberInputProps) => JSX.Element;
+    PhoneNumberInput: ({ label, errorMessage, id, "data-error-testid": errorTestId, "data-testid": testId, layoutType, xxsCols, xsCols, smCols, mdCols, lgCols, xlCols, xxlCols, ...otherProps }: import("./types").FormPhoneNumberInputProps) => JSX.Element;
+    PredictiveTextInput: <T, V>({ label, errorMessage, id, "data-error-testid": errorTestId, "data-testid": testId, layoutType, xxsCols, xsCols, smCols, mdCols, lgCols, xlCols, xxlCols, ...otherProps }: import("./types").FormPredictiveTextInputProps<T, V>) => JSX.Element;
+    OtpVerification: ({ label, id, "data-error-testid": errorTestId, "data-testid": testId, layoutType, xxsCols, xsCols, smCols, mdCols, lgCols, xlCols, xxlCols, ...otherProps }: import("../otp-verification").FormOtpVerificationProps) => JSX.Element;
 };

package/form/types.d.ts

@@ -20,7 +20,6 @@ import type { SelectHistogramProps } from "../select-histogram";
 import type { TimeRangePickerProps } from "../time-range-picker/types";
 import type { TimepickerProps } from "../timepicker/types";
 import type { UnitNumberInputProps } from "../unit-number/types";
-import type { V2_ColProps } from "../v2_layout/types";
 export type FormLabelAddonType = "tooltip" | "popover";
 export interface FormLabelAddonTriggerProps {
     addonType?: FormLabelAddonType | undefined;
@@ -37,12 +36,11 @@ export interface FormLabelAddonProps {
 }
 export interface FormLabelProps extends React.LabelHTMLAttributes<HTMLLabelElement> {
     addon?: FormLabelAddonProps | undefined;
-    disabled?: boolean | undefined;
     subtitle?: string | JSX.Element | undefined;
     "data-testid"?: string | undefined;
 }
-export type FormElementLayoutType = "flex" | "grid" | "v2-grid";
-export interface BaseFormElementProps extends V2_ColProps, ColProps {
+export type FormElementLayoutType = "flex" | "grid";
+export interface BaseFormElementProps extends ColProps {
     label?: FormLabelProps | string | undefined;
     errorMessage?: string | React.ReactNode | undefined;
     "data-testid"?: string | undefined;
@@ -53,7 +51,6 @@ export interface BaseFormElementProps extends V2_ColProps, ColProps {
 export interface FormWrapperProps extends BaseFormElementProps {
     children: JSX.Element | JSX.Element[];
     id?: string | undefined;
-    disabled?: boolean | undefined;
 }
 export interface FormInputProps extends InputPartialProps, BaseFormElementProps {
 }

package/fullscreen-image-carousel/fullscreen-image-carousel.d.ts

@@ -1,2 +1,3 @@
 import type { FullscreenImageCarouselProps, FullscreenImageCarouselRef } from "./types";
+export declare const Component: ({ items, initialActiveItemIndex, hideThumbnail, hideNavigation, hideCounter, hideMagnifier, onDelete, onClose, insets, show, ...otherProps }: FullscreenImageCarouselProps, ref: React.Ref<FullscreenImageCarouselRef>) => import("react/jsx-runtime").JSX.Element;
 export declare const FullscreenImageCarousel: (props: FullscreenImageCarouselProps & import("react").RefAttributes<FullscreenImageCarouselRef>) => React.ReactElement | null;

package/fullscreen-image-carousel/fullscreen-image-carousel.js

@@ -1,2 +1,2 @@
-import{__rest as i}from"../_virtual/_tslib.js";import{jsxs as e,jsx as t,Fragment as n}from"react/jsx-runtime";import{CrossIcon as r,MagnifierPlusIcon as l,MagnifierMinusIcon as o,ChevronLeftIcon as a,ChevronRightIcon as d}from"@lifesg/react-icons";import{forwardRef as s,useState as c,useRef as h,useImperativeHandle as u,useEffect as m}from"react";import{TransformWrapper as v,TransformComponent as g}from"react-zoom-pan-pinch";import{Modal as f}from"../modal/index.js";import"../util/calendar-helper.js";import"../external/dayjs/dayjs.min.js";import"../util/string-helper.js";import{useEventListener as p}from"../util/use-event-listener.js";import{CloseButton as b,MagnifierButton as $,ImageGalleryContainer as T,ImageGalleryWrapper as j,ArrowButton as w,ImageGallerySwipe as I,BoxChip as C,Chip as x,ImageGallerySlides as k,ImageGallerySlide as y,SlideImage as R,SlidePlaceholderImage as A,ThumbnailContainer as M,ThumbnailWrapper as S,ThumbnailItemContainer as V,ThumbnailItem as Z,ThumbnailImage as H}from"./fullscreen-image-carousel.style.js";const L=s(((s,L)=>{var{items:N,initialActiveItemIndex:O,hideThumbnail:W=!1,hideNavigation:X=!1,hideCounter:D=!1,hideMagnifier:E=!1,onClose:_,insets:z}=s,B=i(s,["items","initialActiveItemIndex","hideThumbnail","hideNavigation","hideCounter","hideMagnifier","onClose","insets"]);const[P,q]=c(null!=O?O:0),[F,G]=c({}),[J,K]=c(1),[Q,U]=c(),[Y,ii]=c(),ei=h(null),ti=h([]),ni=h([]),ri=Q&&Y?Q-Y:0;u(L,(()=>({currentItemIndex:P,setCurrentItem:ci,goToPrevItem:di,goToNextItem:si}))),p("keydown",(function(i){"ArrowRight"===i.key?si():"ArrowLeft"===i.key?di():"Escape"===i.key&&(null==_||_())}),"document"),m((()=>{var i,e;null===(e=null===(i=ti.current)||void 0===i?void 0:i[P])||void 0===e||e.scrollIntoView({behavior:"smooth",inline:"center"}),K(1)}),[P]);const li=i=>{K(i.state.scale)};const oi=({src:i,height:e,width:t})=>{G((n=>Object.assign(Object.assign({},n),{[i]:{height:e,width:t}})))},ai=()=>{const i=F[N[P].src];if(ei.current&&i){const{clientHeight:e,clientWidth:t}=ei.current,{width:n,height:r}=i,l=r/n<e/t;return n<t&&r<e?l?t/n:e/r:l?e/(r/(n/t)):t/(n/(r/e))}},di=()=>{var i,e;null===(e=null===(i=ni.current)||void 0===i?void 0:i[P])||void 0===e||e.resetTransform(),q((i=>0===i?N.length-1:i-1))},si=()=>{var i,e;null===(e=null===(i=ni.current)||void 0===i?void 0:i[P])||void 0===e||e.resetTransform(),q((i=>i===N.length-1?0:i+1))},ci=i=>{var e,t;null===(t=null===(e=ni.current)||void 0===e?void 0:e[P])||void 0===t||t.resetTransform(),q(i)};return e(f,Object.assign({},B,{"data-testid":"image-carousel-modal",children:[t(b,{"aria-label":"Close image carousel",onClick:_,focusHighlight:!1,$insetTop:null==z?void 0:z.top,$insetRight:null==z?void 0:z.right,children:t(r,{"aria-hidden":!0})}),!E&&t($,{"aria-label":1===J?"Zoom in":"Zoom out",onClick:()=>{var i,e,t,n;if(1===J){const t=ai();null===(e=null===(i=ni.current)||void 0===i?void 0:i[P])||void 0===e||e.centerView(t),K(null!=t?t:1)}else K(1),null===(n=null===(t=ni.current)||void 0===t?void 0:t[P])||void 0===n||n.resetTransform()},focusHighlight:!1,$insetTop:null==z?void 0:z.top,$insetRight:null==z?void 0:z.right,children:t(1===J?l:o,{"aria-hidden":!0})}),e(T,{children:[e(j,{children:[!X&&e(n,{children:[t(w,{"aria-label":"View previous image","data-testid":"prev-btn",$position:"left",onClick:di,$insetLeft:null==z?void 0:z.left,$insetRight:null==z?void 0:z.right,children:t(a,{"aria-hidden":!0})}),t(w,{"aria-label":"View next image","data-testid":"forward-btn",$position:"right",onClick:si,$insetLeft:null==z?void 0:z.left,$insetRight:null==z?void 0:z.right,children:t(d,{"aria-hidden":!0})})]}),t(I,{ref:ei,onTouchStart:i=>{J<=1&&U(i.touches[0].clientX)},onTouchMove:i=>{!Q||J>1||ii(i.touches[0].clientX)},onTouchEnd:()=>{ei.current&&(Math.abs(ri)>ei.current.offsetWidth/3&&(ri>0?si():di()),U(void 0),ii(void 0))},children:t(k,{style:{transform:`translateX(calc(${100*-P}% - ${ri}px))`},children:N.map(((i,e)=>{var n;return t(y,{"data-testid":"slide-item",children:t(v,{ref:i=>ni.current[e]=i,panning:{disabled:J<=1},initialScale:1,onZoom:li,onZoomStop:li,onWheel:li,children:t(g,{children:t(R,{src:i.src,alt:null!==(n=i.alt)&&void 0!==n?n:`Image ${e+1}`,placeholder:t(A,{}),fit:"scale-down",retrieveImageDimension:!0,setDimension:oi})})})},e)}))})}),!D&&t(C,{children:t(x,{weight:"semibold",children:`${P+1}/${N.length}`})})]}),!W&&t(M,{$insetBottom:null==z?void 0:z.bottom,children:t(S,{children:N.map(((i,e)=>{var n;const r=null!==(n=i.thumbnailSrc)&&void 0!==n?n:i.src;return t(V,{children:t(Z,{"data-testid":"thumbnail-item",$active:e===P,onClick:()=>ci(e),ref:i=>ti.current[e]=i,children:t(H,{src:r,alt:`Thumbnail ${e+1}`,fit:"cover"})})},e)}))})})]})]}))}));export{L as FullscreenImageCarousel};
+import{__rest as e}from"../_virtual/_tslib.js";import{jsx as i,jsxs as t,Fragment as n}from"react/jsx-runtime";import{ChevronLeftIcon as r,ChevronRightIcon as l,MagnifierPlusIcon as o,MagnifierMinusIcon as a,CrossIcon as d}from"@lifesg/react-icons";import{BinIcon as s}from"@lifesg/react-icons/bin";import{clearAnnouncer as c,announce as h}from"@react-aria/live-announcer";import{forwardRef as u,useState as m,useRef as v,useMemo as f,useCallback as g,useImperativeHandle as p,useEffect as b}from"react";import{TransformWrapper as $,TransformComponent as j}from"react-zoom-pan-pinch";import{ModalV2 as I}from"../modal-v2/index.js";import{useStateCallback as C}from"../shared/hooks/use-state-callback.js";import"../external/lodash/_root.js";import"../external/lodash/_baseGetTag.js";import"../util/calendar-helper.js";import"../external/dayjs/dayjs.min.js";import"../util/simple-id-generator.js";import"../util/string-helper.js";import{useEventListener as w}from"../util/use-event-listener.js";import{CarouselModalContent as T,ImageGalleryContainer as x,ImageGalleryWrapper as k,ImageGallerySwipe as y,ArrowButton as L,BoxChip as S,Chip as N,TopActionButtons as D,MagnifierButton as M,DeleteButton as z,CloseButton as A,ImageGallerySlides as R,ImageGallerySlide as Z,FocusableImageRegion as _,SlidePlaceholderImage as O,SlideImage as W,ThumbnailContainer as X,ThumbnailWrapper as E,ThumbnailItemContainer as F,ThumbnailItem as P,ThumbnailImage as V,FileInfoTextWrapper as B,FileInfoFileName as G,FileInfoFileSize as H}from"./fullscreen-image-carousel.style.js";const q=e=>!!e&&"custom"===e.type,J=(u,J)=>{var K,{items:Q,initialActiveItemIndex:U,hideThumbnail:Y=!1,hideNavigation:ee=!1,hideCounter:ie=!1,hideMagnifier:te=!1,onDelete:ne,onClose:re,insets:le,show:oe}=u,ae=e(u,["items","initialActiveItemIndex","hideThumbnail","hideNavigation","hideCounter","hideMagnifier","onDelete","onClose","insets","show"]);const[de,se]=C(null!=U?U:0),[ce,he]=m({}),[ue,me]=m(1),[ve,fe]=m(),[ge,pe]=m(),be=v(null),$e=v([]),je=v([]),Ie=v(null),Ce=ve&&ge?ve-ge:0,we=Q[de],Te=Q.some((e=>{var i;return q(e)&&!!(null===(i=e.itemLabel)||void 0===i?void 0:i.trim())})),xe=Te?"item":"image",ke=f((()=>Q.some((e=>{var i,t;return(null===(i=e.fileName)||void 0===i?void 0:i.trim())||(null===(t=e.fileSize)||void 0===t?void 0:t.trim())}))),[Q]),ye=g((e=>{var i,t;const n=Q[e],r=Te?"Item":"Image",l=q(n)?(null===(i=n.itemLabel)||void 0===i?void 0:i.trim())||"":(null===(t=n.alt)||void 0===t?void 0:t.trim())||"",o=`${r} ${e+1} of ${Q.length}.`;return l?`${l}. ${o}`:o}),[Q,Te]);p(J,(()=>({currentItemIndex:de,setCurrentItem:ze,goToPrevItem:De,goToNextItem:Me}))),w("keydown",(function(e){"ArrowRight"===e.key?Me():"ArrowLeft"===e.key?De():"Escape"===e.key&&(null==re||re())}),"document"),b((()=>{var e;oe&&(null===(e=Ie.current)||void 0===e||e.focus())}),[oe]),b((()=>{0!==Q.length?de>Q.length-1&&se(Q.length-1):se(0)}),[de,Q.length,se]),b((()=>{var e,i;null===(i=null===(e=$e.current)||void 0===e?void 0:e[de])||void 0===i||i.scrollIntoView({behavior:"smooth",inline:"center"}),me(1)}),[de]);const Le=e=>{me(e.state.scale)};const Se=({src:e,height:i,width:t})=>{he((n=>Object.assign(Object.assign({},n),{[e]:{height:i,width:t}})))},Ne=()=>{if(!we||q(we))return;const e=ce[we.src];if(be.current&&e){const{clientHeight:i,clientWidth:t}=be.current,{width:n,height:r}=e,l=r/n<i/t;return n<t&&r<i?l?t/n:i/r:l?i/(r/(n/t)):t/(n/(r/i))}},De=()=>{var e,i;null===(i=null===(e=je.current)||void 0===e?void 0:e[de])||void 0===i||i.resetTransform(),se((e=>0===e?Q.length-1:e-1),(e=>{c("polite"),h(ye(e),"polite")}))},Me=()=>{var e,i;null===(i=null===(e=je.current)||void 0===e?void 0:e[de])||void 0===i||i.resetTransform(),se((e=>e===Q.length-1?0:e+1),(e=>{c("polite"),h(ye(e),"polite")}))},ze=e=>{var i,t;null===(t=null===(i=je.current)||void 0===i?void 0:i[de])||void 0===t||t.resetTransform(),se(e)};return i(I,Object.assign({},ae,{"data-testid":"image-carousel-modal","aria-label":Te?"Carousel":"Image carousel",show:oe,disableInitialFocus:!0,children:t(T,{children:[t(x,{children:[t(k,{children:[i(y,{ref:be,onTouchStart:e=>{ue<=1&&fe(e.touches[0].clientX)},onTouchMove:e=>{!ve||ue>1||pe(e.touches[0].clientX)},onTouchEnd:()=>{be.current&&(Math.abs(Ce)>be.current.offsetWidth/3&&(Ce>0?Me():De()),fe(void 0),pe(void 0))},children:i(R,{style:{transform:`translateX(calc(${100*-de}% - ${Ce}px))`},children:Q.map(((e,t)=>{const n=t===de,r=Math.abs(t-de)<=1||0===de&&t===Q.length-1||de===Q.length-1&&0===t;return i(Z,{"data-testid":"slide-item",children:i(_,{ref:n?Ie:null,tabIndex:n?0:-1,children:q(e)?r?e.renderContent():i(O,{}):i($,{ref:e=>je.current[t]=e,panning:{disabled:ue<=1},initialScale:1,onZoom:Le,onZoomStop:Le,onWheel:Le,children:i(j,{children:i(W,{src:e.src,alt:ye(t),placeholder:i(O,{}),fit:"scale-down",retrieveImageDimension:!0,setDimension:Se})})})})},t)}))})}),!ee&&t(n,{children:[i(L,{"aria-label":`Previous ${xe}`,"data-testid":"prev-btn",$position:"left",onClick:De,$insetLeft:null==le?void 0:le.left,$insetRight:null==le?void 0:le.right,children:i(r,{"aria-hidden":!0})}),i(L,{"aria-label":`Next ${xe}`,"data-testid":"forward-btn",$position:"right",onClick:Me,$insetLeft:null==le?void 0:le.left,$insetRight:null==le?void 0:le.right,children:i(l,{"aria-hidden":!0})})]}),!ie&&i(S,{"aria-hidden":"true",children:i(N,{weight:"semibold",children:`${de+1}/${Q.length}`})})]}),!Y&&i(X,{$insetBottom:null==le?void 0:le.bottom,"aria-hidden":"true",children:i(E,{children:Q.map(((e,t)=>{var n;const r=q(e)?e.thumbnailSrc:null!==(n=e.thumbnailSrc)&&void 0!==n?n:e.src;return i(F,{children:i(P,{"data-testid":"thumbnail-item",$active:t===de,onClick:()=>ze(t),ref:e=>$e.current[t]=e,children:r?i(V,{src:r,alt:`Thumbnail ${t+1}`,fit:"cover"}):i(O,{})})},t)}))})})]}),t(D,{$hasFileInfo:ke,$insetTop:null==le?void 0:le.top,$insetLeft:null==le?void 0:le.left,$insetRight:null==le?void 0:le.right,children:[ke&&(()=>{const{fileName:e,fileSize:n}=null!=we?we:{},r=null==e?void 0:e.trim(),l=null==n?void 0:n.trim();return t(B,{$centerContent:!l,"aria-live":"polite","aria-atomic":"true","data-testid":"file-info-bar",children:[r&&i(G,{weight:"semibold","data-testid":"file-info-name",children:r}),l&&i(H,{"data-testid":"file-info-size",children:l})]})})(),!te&&!q(we)&&i(M,{"aria-label":1===ue?"Zoom in":"Zoom out",onClick:()=>{var e,i,t,n;if(1===ue){const t=Ne();null===(i=null===(e=je.current)||void 0===e?void 0:e[de])||void 0===i||i.centerView(t),me(null!=t?t:1)}else me(1),null===(n=null===(t=je.current)||void 0===t?void 0:t[de])||void 0===n||n.resetTransform()},children:i(1===ue?o:a,{"aria-hidden":!0})}),ne&&i(z,{"aria-label":`Delete ${q(we)&&(null===(K=we.itemLabel)||void 0===K?void 0:K.trim())||"image"}`,"data-testid":"delete-btn",onClick:()=>{we&&ne&&ne(we,de)},children:i(s,{"aria-hidden":!0})}),i(A,{"aria-label":Te?"Close carousel":"Close image carousel",onClick:re,children:i(d,{"aria-hidden":!0})})]})]})}))},K=u(J);export{J as Component,K as FullscreenImageCarousel};
 //# sourceMappingURL=fullscreen-image-carousel.js.map