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

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 t}from"./form-wrapper.js";const l=l=>{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}=l,b=r(l,["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(t,{id:v,"data-testid":p,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{l 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            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            <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,EAAO,cACEb,EACbJ,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,27 @@
+export * from "./types";
 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/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../src/form/index.ts"],"sourcesContent":["import { FormCustomField } from \"./form-custom-field\";\nimport { FormDateInput } from \"./form-date-input\";\nimport { FormDateRangeInput } from \"./form-date-range-input\";\nimport { FormESignature } from \"./form-e-signature\";\nimport { FormHistogramSlider } from \"./form-histogram\";\nimport { FormInput } from \"./form-input\";\nimport { FormInputGroup } from \"./form-input-group\";\nimport { FormLabel } from \"./form-label\";\nimport { FormMaskedInput } from \"./form-masked-input\";\nimport { FormMultiSelect } from \"./form-multi-select\";\nimport { FormNestedMultiSelect } from \"./form-nested-multi-select\";\nimport { FormNestedSelect } from \"./form-nested-select\";\nimport { FormOtpVerification } from \"./form-otp-verification\";\nimport { FormPhoneNumberInput } from \"./form-phone-number-input\";\nimport { FormPredictiveTextInput } from \"./form-predictive-text-input\";\nimport { FormRangeSelect } from \"./form-range-select\";\nimport { FormRangeSlider } from \"./form-range-slider\";\nimport { FormSelect } from \"./form-select\";\nimport { FormSelectHistogram } from \"./form-select-histogram\";\nimport { FormSlider } from \"./form-slider\";\nimport { FormTextarea } from \"./form-textarea\";\nimport { FormTimeRangePicker } from \"./form-time-range-picker\";\nimport { FormTimepicker } from \"./form-timepicker\";\nimport { FormUnitNumberInput } from \"./form-unit-number-input\";\n\nexport const Form = {\n    DateInput: FormDateInput,\n    DateRangeInput: FormDateRangeInput,\n    ESignature: FormESignature,\n    HistogramSlider: FormHistogramSlider,\n    Input: FormInput,\n    InputGroup: FormInputGroup,\n    MaskedInput: FormMaskedInput,\n    Label: FormLabel,\n    MultiSelect: FormMultiSelect,\n    NestedSelect: FormNestedSelect,\n    NestedMultiSelect: FormNestedMultiSelect,\n    Select: FormSelect,\n    SelectHistogram: FormSelectHistogram,\n    Slider: FormSlider,\n    RangeSlider: FormRangeSlider,\n    RangeSelect: FormRangeSelect,\n    Textarea: FormTextarea,\n    Timepicker: FormTimepicker,\n    TimeRangePicker: FormTimeRangePicker,\n    CustomField: FormCustomField,\n    UnitNumberInput: FormUnitNumberInput,\n    PhoneNumberInput: FormPhoneNumberInput,\n    PredictiveTextInput: FormPredictiveTextInput,\n    OtpVerification: FormOtpVerification,\n};\n"],"names":["Form","DateInput","FormDateInput","DateRangeInput","FormDateRangeInput","ESignature","FormESignature","HistogramSlider","FormHistogramSlider","Input","FormInput","InputGroup","FormInputGroup","MaskedInput","FormMaskedInput","Label","FormLabel","MultiSelect","FormMultiSelect","NestedSelect","FormNestedSelect","NestedMultiSelect","FormNestedMultiSelect","Select","FormSelect","SelectHistogram","FormSelectHistogram","Slider","FormSlider","RangeSlider","FormRangeSlider","RangeSelect","FormRangeSelect","Textarea","FormTextarea","Timepicker","FormTimepicker","TimeRangePicker","FormTimeRangePicker","CustomField","FormCustomField","UnitNumberInput","FormUnitNumberInput","PhoneNumberInput","FormPhoneNumberInput","PredictiveTextInput","FormPredictiveTextInput","OtpVerification","FormOtpVerification"],"mappings":"22CAyBO,MAAMA,EAAO,CAChBC,UAAWC,EACXC,eAAgBC,EAChBC,WAAYC,EACZC,gBAAiBC,EACjBC,MAAOC,EACPC,WAAYC,EACZC,YAAaC,EACbC,MAAOC,EACPC,YAAaC,EACbC,aAAcC,EACdC,kBAAmBC,EACnBC,OAAQC,EACRC,gBAAiBC,EACjBC,OAAQC,EACRC,YAAaC,EACbC,YAAaC,EACbC,SAAUC,EACVC,WAAYC,EACZC,gBAAiBC,EACjBC,YAAaC,EACbC,gBAAiBC,EACjBC,iBAAkBC,EAClBC,oBAAqBC,EACrBC,gBAAiBC"}
+{"version":3,"file":"index.js","sources":["../../src/form/index.ts"],"sourcesContent":["import { FormCustomField } from \"./form-custom-field\";\nimport { FormDateInput } from \"./form-date-input\";\nimport { FormDateRangeInput } from \"./form-date-range-input\";\nimport { FormESignature } from \"./form-e-signature\";\nimport { FormHistogramSlider } from \"./form-histogram\";\nimport { FormInput } from \"./form-input\";\nimport { FormInputGroup } from \"./form-input-group\";\nimport { FormLabel } from \"./form-label\";\nimport { FormMaskedInput } from \"./form-masked-input\";\nimport { FormMultiSelect } from \"./form-multi-select\";\nimport { FormNestedMultiSelect } from \"./form-nested-multi-select\";\nimport { FormNestedSelect } from \"./form-nested-select\";\nimport { FormOtpVerification } from \"./form-otp-verification\";\nimport { FormPhoneNumberInput } from \"./form-phone-number-input\";\nimport { FormPredictiveTextInput } from \"./form-predictive-text-input\";\nimport { FormRangeSelect } from \"./form-range-select\";\nimport { FormRangeSlider } from \"./form-range-slider\";\nimport { FormSelect } from \"./form-select\";\nimport { FormSelectHistogram } from \"./form-select-histogram\";\nimport { FormSlider } from \"./form-slider\";\nimport { FormTextarea } from \"./form-textarea\";\nimport { FormTimeRangePicker } from \"./form-time-range-picker\";\nimport { FormTimepicker } from \"./form-timepicker\";\nimport { FormUnitNumberInput } from \"./form-unit-number-input\";\n\nexport * from \"./types\";\n\nexport const Form = {\n    DateInput: FormDateInput,\n    DateRangeInput: FormDateRangeInput,\n    ESignature: FormESignature,\n    HistogramSlider: FormHistogramSlider,\n    Input: FormInput,\n    InputGroup: FormInputGroup,\n    MaskedInput: FormMaskedInput,\n    Label: FormLabel,\n    MultiSelect: FormMultiSelect,\n    NestedSelect: FormNestedSelect,\n    NestedMultiSelect: FormNestedMultiSelect,\n    Select: FormSelect,\n    SelectHistogram: FormSelectHistogram,\n    Slider: FormSlider,\n    RangeSlider: FormRangeSlider,\n    RangeSelect: FormRangeSelect,\n    Textarea: FormTextarea,\n    Timepicker: FormTimepicker,\n    TimeRangePicker: FormTimeRangePicker,\n    CustomField: FormCustomField,\n    UnitNumberInput: FormUnitNumberInput,\n    PhoneNumberInput: FormPhoneNumberInput,\n    PredictiveTextInput: FormPredictiveTextInput,\n    OtpVerification: FormOtpVerification,\n};\n"],"names":["Form","DateInput","FormDateInput","DateRangeInput","FormDateRangeInput","ESignature","FormESignature","HistogramSlider","FormHistogramSlider","Input","FormInput","InputGroup","FormInputGroup","MaskedInput","FormMaskedInput","Label","FormLabel","MultiSelect","FormMultiSelect","NestedSelect","FormNestedSelect","NestedMultiSelect","FormNestedMultiSelect","Select","FormSelect","SelectHistogram","FormSelectHistogram","Slider","FormSlider","RangeSlider","FormRangeSlider","RangeSelect","FormRangeSelect","Textarea","FormTextarea","Timepicker","FormTimepicker","TimeRangePicker","FormTimeRangePicker","CustomField","FormCustomField","UnitNumberInput","FormUnitNumberInput","PhoneNumberInput","FormPhoneNumberInput","PredictiveTextInput","FormPredictiveTextInput","OtpVerification","FormOtpVerification"],"mappings":"22CA2BO,MAAMA,EAAO,CAChBC,UAAWC,EACXC,eAAgBC,EAChBC,WAAYC,EACZC,gBAAiBC,EACjBC,MAAOC,EACPC,WAAYC,EACZC,YAAaC,EACbC,MAAOC,EACPC,YAAaC,EACbC,aAAcC,EACdC,kBAAmBC,EACnBC,OAAQC,EACRC,gBAAiBC,EACjBC,OAAQC,EACRC,YAAaC,EACbC,YAAaC,EACbC,SAAUC,EACVC,WAAYC,EACZC,gBAAiBC,EACjBC,YAAaC,EACbC,gBAAiBC,EACjBC,iBAAkBC,EAClBC,oBAAqBC,EACrBC,gBAAiBC"}

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 l}from"react/jsx-runtime";import{ChevronLeftIcon as r,ChevronRightIcon as o,MagnifierPlusIcon as a,MagnifierMinusIcon as n,CrossIcon as s}from"@lifesg/react-icons";import{BinIcon as d}from"@lifesg/react-icons/bin";import{clearAnnouncer as m,announce as c}from"@react-aria/live-announcer";import u from"clsx";import{forwardRef as h,useState as v,useRef as p,useMemo as f,useCallback as g,useImperativeHandle as b,useEffect as N}from"react";import{TransformWrapper as j,TransformComponent as x}from"react-zoom-pan-pinch";import{ModalV2 as k}from"../modal-v2/index.js";import{ClickableIcon as y}from"../shared/clickable-icon/clickable-icon.js";import{useStateCallback as w}from"../shared/hooks/use-state-callback.js";import"../external/lodash/_root.js";import"../external/lodash/_baseGetTag.js";import{ImagePlaceholder as C}from"../shared/image-placeholder/image-placeholder.js";import"../theme/theme-provider/index.js";import{formatUnitValue as I}from"../theme/utils/css-variable.js";import"../theme/theme-provider/context.js";import"../theme/tokens/border.js";import"../theme/tokens/colour.js";import"../theme/tokens/font.js";import"../theme/tokens/media-query.js";import{useApplyStyle as T}from"../theme/utils/use-apply-styles.js";import"../theme/utils/use-media-query.js";import{Typography as $}from"../typography/index.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 B}from"../util/use-event-listener.js";import{tokens as S,carouselModalContent as A,imageGalleryContainer as L,imageGalleryWrapper as D,imageGallerySwipe as M,iconButton as z,arrowButton as X,arrowButtonLeft as Z,arrowButtonRight as _,boxChip as O,chip as R,topActionButtons as W,iconButtonError as q,imageGallerySlides as E,imageGallerySlide as P,focusableImageRegion as V,slidePlaceholderImage as F,slideImage as G,thumbnailContainer as H,thumbnailWrapper as J,thumbnailItemContainer as K,thumbnailItem as Q,thumbnailImage as U,fileInfoFileName as Y,fileInfoFileSize as ee,fileInfoTextWrapper as ie,fileInfoTextWrapperCentered as te}from"./fullscreen-image-carousel.styles.js";import{StatefulImage as le}from"./stateful-image.js";const re=e=>!!e&&"custom"===e.type,oe=(h,oe)=>{var ae,{items:ne,initialActiveItemIndex:se,hideThumbnail:de=!1,hideNavigation:me=!1,hideCounter:ce=!1,hideMagnifier:ue=!1,onDelete:he,onClose:ve,insets:pe,show:fe}=h,ge=e(h,["items","initialActiveItemIndex","hideThumbnail","hideNavigation","hideCounter","hideMagnifier","onDelete","onClose","insets","show"]);const[be,Ne]=w(null!=se?se:0),[je,xe]=v({}),[ke,ye]=v(1),[we,Ce]=v(),[Ie,Te]=v(),$e=p(null),Be=p([]),Se=p([]),Ae=p(null),Le=p(null),De=p(null),Me=p(null),ze=p(null),Xe=we&&Ie?we-Ie:0,Ze=ne[be],_e=ne.some((e=>{var i;return re(e)&&!!(null===(i=e.itemLabel)||void 0===i?void 0:i.trim())})),Oe=_e?"item":"image",Re=f((()=>ne.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())}))),[ne]);T(Le,{[S.topActionButtons.insetTop]:I(null==pe?void 0:pe.top,"px"),[S.topActionButtons.insetLeft]:I(null==pe?void 0:pe.left,"px"),[S.topActionButtons.insetRight]:I(null==pe?void 0:pe.right,"px")}),T(De,{[S.arrowButton.insetLeft]:I(null==pe?void 0:pe.left,"px")}),T(Me,{[S.arrowButton.insetRight]:I(null==pe?void 0:pe.right,"px")}),T(ze,{[S.thumbnailContainer.insetBottom]:I(null==pe?void 0:pe.bottom,"px")});const We=g((e=>{var i,t;const l=ne[e],r=_e?"Item":"Image",o=re(l)?(null===(i=l.itemLabel)||void 0===i?void 0:i.trim())||"":(null===(t=l.alt)||void 0===t?void 0:t.trim())||"",a=`${r} ${e+1} of ${ne.length}.`;return o?`${o}. ${a}`:a}),[ne,_e]);b(oe,(()=>({currentItemIndex:be,setCurrentItem:Ge,goToPrevItem:Ve,goToNextItem:Fe}))),B("keydown",(function(e){"ArrowRight"===e.key?Fe():"ArrowLeft"===e.key?Ve():"Escape"===e.key&&(null==ve||ve())}),"document"),N((()=>{var e;fe&&(null===(e=Ae.current)||void 0===e||e.focus())}),[fe]),N((()=>{0!==ne.length?be>ne.length-1&&Ne(ne.length-1):Ne(0)}),[be,ne.length,Ne]),N((()=>{var e,i;null===(i=null===(e=Be.current)||void 0===e?void 0:e[be])||void 0===i||i.scrollIntoView({behavior:"smooth",inline:"center"}),ye(1)}),[be]);const qe=e=>{ye(e.state.scale)};const Ee=({src:e,height:i,width:t})=>{xe((l=>Object.assign(Object.assign({},l),{[e]:{height:i,width:t}})))},Pe=()=>{if(!Ze||re(Ze))return;const e=je[Ze.src];if($e.current&&e){const{clientHeight:i,clientWidth:t}=$e.current,{width:l,height:r}=e,o=r/l<i/t;return l<t&&r<i?o?t/l:i/r:o?i/(r/(l/t)):t/(l/(r/i))}},Ve=()=>{var e,i;null===(i=null===(e=Se.current)||void 0===e?void 0:e[be])||void 0===i||i.resetTransform(),Ne((e=>0===e?ne.length-1:e-1),(e=>{m("polite"),c(We(e),"polite")}))},Fe=()=>{var e,i;null===(i=null===(e=Se.current)||void 0===e?void 0:e[be])||void 0===i||i.resetTransform(),Ne((e=>e===ne.length-1?0:e+1),(e=>{m("polite"),c(We(e),"polite")}))},Ge=e=>{var i,t;null===(t=null===(i=Se.current)||void 0===i?void 0:i[be])||void 0===t||t.resetTransform(),Ne(e)};return i(k,Object.assign({},ge,{"data-testid":"image-carousel-modal","aria-label":_e?"Carousel":"Image carousel",show:fe,disableInitialFocus:!0,children:t("div",{className:A,children:[t("div",{className:L,children:[t("div",{className:D,children:[i("div",{className:M,ref:$e,onTouchStart:e=>{ke<=1&&Ce(e.touches[0].clientX)},onTouchMove:e=>{!we||ke>1||Te(e.touches[0].clientX)},onTouchEnd:()=>{$e.current&&(Math.abs(Xe)>$e.current.offsetWidth/3&&(Xe>0?Fe():Ve()),Ce(void 0),Te(void 0))},children:i("div",{className:E,style:{transform:`translateX(calc(${100*-be}% - ${Xe}px))`},children:ne.map(((e,t)=>{const l=t===be,r=Math.abs(t-be)<=1||0===be&&t===ne.length-1||be===ne.length-1&&0===t;return i("div",{className:P,"data-testid":"slide-item",children:i("div",{className:V,ref:l?Ae:null,tabIndex:l?0:-1,children:re(e)?r?e.renderContent():i(C,{className:F}):i(j,{ref:e=>Se.current[t]=e,panning:{disabled:ke<=1},initialScale:1,onZoom:qe,onZoomStop:qe,onWheel:qe,children:i(x,{children:i(le,{className:G,src:e.src,alt:We(t),placeholder:i(C,{className:F}),fit:"scale-down",retrieveImageDimension:!0,setDimension:Ee})})})})},t)}))})}),!me&&t(l,{children:[i(y,{className:u(z,X,Z),ref:De,"aria-label":`Previous ${Oe}`,"data-testid":"prev-btn",onClick:Ve,children:i(r,{"aria-hidden":!0})}),i(y,{className:u(z,X,_),ref:Me,"aria-label":`Next ${Oe}`,"data-testid":"forward-btn",onClick:Fe,children:i(o,{"aria-hidden":!0})})]}),!ce&&i("div",{className:O,"aria-hidden":"true",children:i($.BodyXS,{className:R,weight:"semibold","data-testid":"carousel-counter",children:`${be+1}/${ne.length}`})})]}),!de&&i("div",{className:H,ref:ze,"aria-hidden":"true","data-testid":"thumbnail-container",children:i("div",{className:J,children:ne.map(((e,t)=>{var l;const r=re(e)?e.thumbnailSrc:null!==(l=e.thumbnailSrc)&&void 0!==l?l:e.src;return i("div",{className:K,children:i("div",{className:Q,"data-active":t===be,"data-testid":"thumbnail-item",onClick:()=>Ge(t),ref:e=>Be.current[t]=e,children:r?i(le,{className:U,src:r,alt:`Thumbnail ${t+1}`,fit:"cover"}):i(C,{className:F})})},t)}))})})]}),t("div",{className:W,ref:Le,"data-has-file-info":Re,children:[Re&&(()=>{const{fileName:e,fileSize:l}=null!=Ze?Ze:{},r=null==e?void 0:e.trim(),o=null==l?void 0:l.trim();return t("div",{className:u(ie,!o&&te),"aria-live":"polite","aria-atomic":"true","data-testid":"file-info-bar",children:[r&&i($.BodyBL,{className:Y,weight:"semibold","data-testid":"file-info-name",children:r}),o&&i($.BodyMD,{className:ee,"data-testid":"file-info-size",children:o})]})})(),!ue&&!re(Ze)&&i(y,{className:z,"aria-label":1===ke?"Zoom in":"Zoom out",onClick:()=>{var e,i,t,l;if(1===ke){const t=Pe();null===(i=null===(e=Se.current)||void 0===e?void 0:e[be])||void 0===i||i.centerView(t),ye(null!=t?t:1)}else ye(1),null===(l=null===(t=Se.current)||void 0===t?void 0:t[be])||void 0===l||l.resetTransform()},children:i(1===ke?a:n,{"aria-hidden":!0})}),he&&i(y,{className:u(z,q),"aria-label":`Delete ${re(Ze)&&(null===(ae=Ze.itemLabel)||void 0===ae?void 0:ae.trim())||"image"}`,"data-testid":"delete-btn",onClick:()=>{Ze&&he&&he(Ze,be)},children:i(d,{"aria-hidden":!0})}),i(y,{className:z,"aria-label":_e?"Close carousel":"Close image carousel",onClick:ve,children:i(s,{"aria-hidden":!0})})]})]})}))},ae=h(oe);export{oe as Component,ae as FullscreenImageCarousel};
 //# sourceMappingURL=fullscreen-image-carousel.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"fullscreen-image-carousel.js","sources":["../../src/fullscreen-image-carousel/fullscreen-image-carousel.tsx"],"sourcesContent":["import {\n    ChevronLeftIcon,\n    ChevronRightIcon,\n    CrossIcon,\n    MagnifierMinusIcon,\n    MagnifierPlusIcon,\n} from \"@lifesg/react-icons\";\nimport {\n    forwardRef,\n    useEffect,\n    useImperativeHandle,\n    useRef,\n    useState,\n} from \"react\";\nimport type {\n    ReactZoomPanPinchContentRef,\n    ReactZoomPanPinchRef,\n} from \"react-zoom-pan-pinch\";\nimport { TransformComponent, TransformWrapper } from \"react-zoom-pan-pinch\";\n\nimport { Modal } from \"../modal\";\nimport { useEventListener } from \"../util\";\nimport {\n    ArrowButton,\n    BoxChip,\n    Chip,\n    CloseButton,\n    ImageGalleryContainer,\n    ImageGallerySlide,\n    ImageGallerySlides,\n    ImageGallerySwipe,\n    ImageGalleryWrapper,\n    MagnifierButton,\n    SlideImage,\n    SlidePlaceholderImage,\n    ThumbnailContainer,\n    ThumbnailImage,\n    ThumbnailItem,\n    ThumbnailItemContainer,\n    ThumbnailWrapper,\n} from \"./fullscreen-image-carousel.style\";\nimport type {\n    FullscreenImageCarouselProps,\n    FullscreenImageCarouselRef,\n    ImageDimension,\n} from \"./types\";\n\nconst Component = (\n    {\n        items,\n        initialActiveItemIndex,\n        hideThumbnail = false,\n        hideNavigation = false,\n        hideCounter = false,\n        hideMagnifier = false,\n        onClose,\n        insets,\n        ...otherProps\n    }: FullscreenImageCarouselProps,\n    ref: React.Ref<FullscreenImageCarouselRef>\n) => {\n    // =============================================================================\n    // CONST, STATE, REF\n    // =============================================================================\n    const [currentSlide, setCurrentSlide] = useState(\n        initialActiveItemIndex ?? 0\n    );\n    const [imagesDimension, setImageDimension] = useState<\n        Record<string, ImageDimension>\n    >({});\n    const [zoom, setZoom] = useState(1);\n    const [startX, setStartX] = useState<number | undefined>();\n    const [endX, setEndX] = useState<number | undefined>();\n    const containerRef = useRef<HTMLDivElement>(null);\n    const thumbnailRefs = useRef<(HTMLDivElement | null)[]>([]);\n    const zoomRefs = useRef<(ReactZoomPanPinchContentRef | null)[]>([]);\n    const diff = startX && endX ? startX - endX : 0;\n\n    useImperativeHandle<FullscreenImageCarouselRef, FullscreenImageCarouselRef>(\n        ref,\n        () => ({\n            currentItemIndex: currentSlide,\n            setCurrentItem: goToSlide,\n            goToPrevItem: goToPrevSlide,\n            goToNextItem: goToNextSlide,\n        })\n    );\n\n    // =============================================================================\n    // EFFECTS\n    // =============================================================================\n    useEventListener(\"keydown\", handleKeyDown, \"document\");\n\n    useEffect(() => {\n        thumbnailRefs.current?.[currentSlide]?.scrollIntoView({\n            behavior: \"smooth\",\n            inline: \"center\",\n        });\n        setZoom(1);\n    }, [currentSlide]);\n\n    // =============================================================================\n    // EVENT HANDLERS\n    // =============================================================================\n    const handleTouchStart = (e: React.TouchEvent) => {\n        if (zoom <= 1) setStartX(e.touches[0].clientX);\n    };\n\n    const handleTouchMove = (e: React.TouchEvent) => {\n        if (!startX || zoom > 1) return;\n        setEndX(e.touches[0].clientX);\n    };\n\n    const handleTouchEnd = () => {\n        if (!containerRef.current) return;\n        if (Math.abs(diff) > containerRef.current.offsetWidth / 3) {\n            if (diff > 0) {\n                goToNextSlide();\n            } else {\n                goToPrevSlide();\n            }\n        }\n        setStartX(undefined);\n        setEndX(undefined);\n    };\n\n    const handleZoom = (e: ReactZoomPanPinchRef) => {\n        setZoom(e.state.scale);\n    };\n\n    function handleKeyDown(e: KeyboardEvent) {\n        if (e.key === \"ArrowRight\") {\n            goToNextSlide();\n        } else if (e.key === \"ArrowLeft\") {\n            goToPrevSlide();\n        } else if (e.key === \"Escape\") {\n            onClose?.();\n        }\n    }\n\n    const handleMagnifier = () => {\n        if (zoom === 1) {\n            const zoomRatio = getZoomRatio();\n            zoomRefs.current?.[currentSlide]?.centerView(zoomRatio);\n            setZoom(zoomRatio ?? 1);\n        } else {\n            setZoom(1);\n            zoomRefs.current?.[currentSlide]?.resetTransform();\n        }\n    };\n\n    const setDimension = ({\n        src,\n        height,\n        width,\n    }: {\n        src: string;\n        height: number;\n        width: number;\n    }) => {\n        setImageDimension((oldState) => {\n            return { ...oldState, [src]: { height, width } };\n        });\n    };\n\n    const getZoomRatio = () => {\n        const imageDimension = imagesDimension[items[currentSlide].src];\n\n        if (containerRef.current && !!imageDimension) {\n            const { clientHeight, clientWidth } = containerRef.current;\n            const { width, height } = imageDimension;\n            const isSmallImg = width < clientWidth && height < clientHeight;\n\n            const isImgLandscapeRelativeToDevice =\n                height / width < clientHeight / clientWidth;\n\n            if (isSmallImg) {\n                return isImgLandscapeRelativeToDevice\n                    ? clientWidth / width\n                    : clientHeight / height;\n            }\n\n            return isImgLandscapeRelativeToDevice\n                ? clientHeight / (height / (width / clientWidth))\n                : clientWidth / (width / (height / clientHeight));\n        }\n    };\n\n    // =============================================================================\n    // HELPER FUNCTIONS\n    // =============================================================================\n    const goToPrevSlide = () => {\n        zoomRefs.current?.[currentSlide]?.resetTransform();\n        setCurrentSlide((prev) => (prev === 0 ? items.length - 1 : prev - 1));\n    };\n\n    const goToNextSlide = () => {\n        zoomRefs.current?.[currentSlide]?.resetTransform();\n        setCurrentSlide((prev) => (prev === items.length - 1 ? 0 : prev + 1));\n    };\n\n    const goToSlide = (index: number) => {\n        zoomRefs.current?.[currentSlide]?.resetTransform();\n        setCurrentSlide(index);\n    };\n\n    // =============================================================================\n    // RENDER FUNCTIONS\n    // =============================================================================\n    const renderSlides = () => {\n        return (\n            <ImageGallerySlides\n                style={{\n                    transform: `translateX(calc(${\n                        -currentSlide * 100\n                    }% - ${diff}px))`,\n                }}\n            >\n                {items.map((item, index) => {\n                    return (\n                        <ImageGallerySlide key={index} data-testid=\"slide-item\">\n                            <TransformWrapper\n                                ref={(el) => (zoomRefs.current[index] = el)}\n                                panning={{\n                                    disabled: zoom <= 1,\n                                }}\n                                initialScale={1}\n                                onZoom={handleZoom}\n                                onZoomStop={handleZoom}\n                                onWheel={handleZoom}\n                            >\n                                <TransformComponent>\n                                    <SlideImage\n                                        src={item.src}\n                                        alt={item.alt ?? `Image ${index + 1}`}\n                                        placeholder={<SlidePlaceholderImage />}\n                                        fit=\"scale-down\"\n                                        retrieveImageDimension\n                                        setDimension={setDimension}\n                                    />\n                                </TransformComponent>\n                            </TransformWrapper>\n                        </ImageGallerySlide>\n                    );\n                })}\n            </ImageGallerySlides>\n        );\n    };\n\n    const renderThumbnails = () => {\n        return (\n            <ThumbnailContainer $insetBottom={insets?.bottom}>\n                <ThumbnailWrapper>\n                    {items.map((item, index) => {\n                        const src = item.thumbnailSrc ?? item.src;\n                        return (\n                            <ThumbnailItemContainer key={index}>\n                                <ThumbnailItem\n                                    data-testid=\"thumbnail-item\"\n                                    $active={index === currentSlide}\n                                    onClick={() => goToSlide(index)}\n                                    ref={(el) =>\n                                        (thumbnailRefs.current[index] = el)\n                                    }\n                                >\n                                    <ThumbnailImage\n                                        src={src}\n                                        alt={`Thumbnail ${index + 1}`}\n                                        fit=\"cover\"\n                                    />\n                                </ThumbnailItem>\n                            </ThumbnailItemContainer>\n                        );\n                    })}\n                </ThumbnailWrapper>\n            </ThumbnailContainer>\n        );\n    };\n\n    return (\n        <Modal {...otherProps} data-testid=\"image-carousel-modal\">\n            <CloseButton\n                aria-label=\"Close image carousel\"\n                onClick={onClose}\n                focusHighlight={false}\n                $insetTop={insets?.top}\n                $insetRight={insets?.right}\n            >\n                <CrossIcon aria-hidden />\n            </CloseButton>\n            {!hideMagnifier && (\n                <MagnifierButton\n                    aria-label={zoom === 1 ? \"Zoom in\" : \"Zoom out\"}\n                    onClick={handleMagnifier}\n                    focusHighlight={false}\n                    $insetTop={insets?.top}\n                    $insetRight={insets?.right}\n                >\n                    {zoom === 1 ? (\n                        <MagnifierPlusIcon aria-hidden />\n                    ) : (\n                        <MagnifierMinusIcon aria-hidden />\n                    )}\n                </MagnifierButton>\n            )}\n            <ImageGalleryContainer>\n                <ImageGalleryWrapper>\n                    {!hideNavigation && (\n                        <>\n                            <ArrowButton\n                                aria-label=\"View previous image\"\n                                data-testid=\"prev-btn\"\n                                $position=\"left\"\n                                onClick={goToPrevSlide}\n                                $insetLeft={insets?.left}\n                                $insetRight={insets?.right}\n                            >\n                                <ChevronLeftIcon aria-hidden />\n                            </ArrowButton>\n                            <ArrowButton\n                                aria-label=\"View next image\"\n                                data-testid=\"forward-btn\"\n                                $position=\"right\"\n                                onClick={goToNextSlide}\n                                $insetLeft={insets?.left}\n                                $insetRight={insets?.right}\n                            >\n                                <ChevronRightIcon aria-hidden />\n                            </ArrowButton>\n                        </>\n                    )}\n                    <ImageGallerySwipe\n                        ref={containerRef}\n                        onTouchStart={handleTouchStart}\n                        onTouchMove={handleTouchMove}\n                        onTouchEnd={handleTouchEnd}\n                    >\n                        {renderSlides()}\n                    </ImageGallerySwipe>\n                    {!hideCounter && (\n                        <BoxChip>\n                            <Chip weight=\"semibold\">{`${currentSlide + 1}/${\n                                items.length\n                            }`}</Chip>\n                        </BoxChip>\n                    )}\n                </ImageGalleryWrapper>\n                {!hideThumbnail && renderThumbnails()}\n            </ImageGalleryContainer>\n        </Modal>\n    );\n};\n\nexport const FullscreenImageCarousel = forwardRef<\n    FullscreenImageCarouselRef,\n    FullscreenImageCarouselProps\n>(Component);\n"],"names":["FullscreenImageCarousel","forwardRef","_a","ref","items","initialActiveItemIndex","hideThumbnail","hideNavigation","hideCounter","hideMagnifier","onClose","insets","otherProps","__rest","currentSlide","setCurrentSlide","useState","imagesDimension","setImageDimension","zoom","setZoom","startX","setStartX","endX","setEndX","containerRef","useRef","thumbnailRefs","zoomRefs","diff","useImperativeHandle","currentItemIndex","setCurrentItem","goToSlide","goToPrevItem","goToPrevSlide","goToNextItem","goToNextSlide","useEventListener","e","key","useEffect","_b","current","scrollIntoView","behavior","inline","handleZoom","state","scale","setDimension","src","height","width","oldState","Object","assign","getZoomRatio","imageDimension","clientHeight","clientWidth","isImgLandscapeRelativeToDevice","resetTransform","prev","length","index","_jsxs","Modal","children","_jsx","CloseButton","onClick","focusHighlight","$insetTop","top","$insetRight","right","CrossIcon","MagnifierButton","zoomRatio","centerView","_d","_c","MagnifierPlusIcon","MagnifierMinusIcon","ImageGalleryContainer","ImageGalleryWrapper","_Fragment","ArrowButton","$position","$insetLeft","left","ChevronLeftIcon","ChevronRightIcon","ImageGallerySwipe","onTouchStart","touches","clientX","onTouchMove","onTouchEnd","Math","abs","offsetWidth","undefined","ImageGallerySlides","style","transform","map","item","ImageGallerySlide","TransformWrapper","el","panning","disabled","initialScale","onZoom","onZoomStop","onWheel","TransformComponent","SlideImage","alt","placeholder","SlidePlaceholderImage","fit","retrieveImageDimension","BoxChip","Chip","weight","ThumbnailContainer","$insetBottom","bottom","ThumbnailWrapper","thumbnailSrc","ThumbnailItemContainer","ThumbnailItem","$active","ThumbnailImage"],"mappings":"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"}
+{"version":3,"file":"fullscreen-image-carousel.js","sources":["../../src/fullscreen-image-carousel/fullscreen-image-carousel.tsx"],"sourcesContent":["import {\n    ChevronLeftIcon,\n    ChevronRightIcon,\n    CrossIcon,\n    MagnifierMinusIcon,\n    MagnifierPlusIcon,\n} from \"@lifesg/react-icons\";\nimport { BinIcon } from \"@lifesg/react-icons/bin\";\nimport { announce, clearAnnouncer } from \"@react-aria/live-announcer\";\nimport clsx from \"clsx\";\nimport {\n    forwardRef,\n    useCallback,\n    useEffect,\n    useImperativeHandle,\n    useMemo,\n    useRef,\n    useState,\n} from \"react\";\nimport type {\n    ReactZoomPanPinchContentRef,\n    ReactZoomPanPinchRef,\n} from \"react-zoom-pan-pinch\";\nimport { TransformComponent, TransformWrapper } from \"react-zoom-pan-pinch\";\n\nimport { ModalV2 } from \"../modal-v2\";\nimport { ClickableIcon } from \"../shared/clickable-icon\";\nimport { useStateCallback } from \"../shared/hooks\";\nimport { ImagePlaceholder } from \"../shared/image-placeholder\";\nimport { formatUnitValue, useApplyStyle } from \"../theme\";\nimport { Typography } from \"../typography\";\nimport { useEventListener } from \"../util\";\nimport * as styles from \"./fullscreen-image-carousel.styles\";\nimport { StatefulImage } from \"./stateful-image\";\nimport type {\n    FullscreenImageCarouselCustomItemProps,\n    FullscreenImageCarouselItemProps,\n    FullscreenImageCarouselProps,\n    FullscreenImageCarouselRef,\n    ImageDimension,\n} from \"./types\";\n\nconst isCustomItem = (\n    item: FullscreenImageCarouselItemProps | undefined\n): item is FullscreenImageCarouselCustomItemProps =>\n    !!item && item.type === \"custom\";\n\nexport const Component = (\n    {\n        items,\n        initialActiveItemIndex,\n        hideThumbnail = false,\n        hideNavigation = false,\n        hideCounter = false,\n        hideMagnifier = false,\n        onDelete,\n        onClose,\n        insets,\n        show,\n        ...otherProps\n    }: FullscreenImageCarouselProps,\n    ref: React.Ref<FullscreenImageCarouselRef>\n) => {\n    // =============================================================================\n    // CONST, STATE, REF\n    // =============================================================================\n    const [currentSlide, setCurrentSlide] = useStateCallback(\n        initialActiveItemIndex ?? 0\n    );\n    const [imagesDimension, setImageDimension] = useState<\n        Record<string, ImageDimension>\n    >({});\n    const [zoom, setZoom] = useState(1);\n    const [startX, setStartX] = useState<number | undefined>();\n    const [endX, setEndX] = useState<number | undefined>();\n    const containerRef = useRef<HTMLDivElement>(null);\n    const thumbnailRefs = useRef<(HTMLDivElement | null)[]>([]);\n    const zoomRefs = useRef<(ReactZoomPanPinchContentRef | null)[]>([]);\n    const imageRef = useRef<HTMLDivElement>(null);\n    const topActionButtonsRef = useRef<HTMLDivElement>(null);\n    const prevArrowButtonRef = useRef<HTMLButtonElement>(null);\n    const nextArrowButtonRef = useRef<HTMLButtonElement>(null);\n    const thumbnailContainerRef = useRef<HTMLDivElement>(null);\n    const diff = startX && endX ? startX - endX : 0;\n    const currentItem = items[currentSlide];\n    const hasAnyItemLabel = items.some(\n        (item) => isCustomItem(item) && !!item.itemLabel?.trim()\n    );\n    const carouselItemNoun = hasAnyItemLabel ? \"item\" : \"image\";\n    const hasFileInfo = useMemo(\n        () =>\n            items.some(\n                (item) => item.fileName?.trim() || item.fileSize?.trim()\n            ),\n        [items]\n    );\n\n    useApplyStyle(topActionButtonsRef, {\n        [styles.tokens.topActionButtons.insetTop]: formatUnitValue(\n            insets?.top,\n            \"px\"\n        ),\n        [styles.tokens.topActionButtons.insetLeft]: formatUnitValue(\n            insets?.left,\n            \"px\"\n        ),\n        [styles.tokens.topActionButtons.insetRight]: formatUnitValue(\n            insets?.right,\n            \"px\"\n        ),\n    });\n\n    useApplyStyle(prevArrowButtonRef, {\n        [styles.tokens.arrowButton.insetLeft]: formatUnitValue(\n            insets?.left,\n            \"px\"\n        ),\n    });\n\n    useApplyStyle(nextArrowButtonRef, {\n        [styles.tokens.arrowButton.insetRight]: formatUnitValue(\n            insets?.right,\n            \"px\"\n        ),\n    });\n\n    useApplyStyle(thumbnailContainerRef, {\n        [styles.tokens.thumbnailContainer.insetBottom]: formatUnitValue(\n            insets?.bottom,\n            \"px\"\n        ),\n    });\n\n    const getItemAriaLabel = useCallback(\n        (index: number) => {\n            const item = items[index];\n            const itemTypeLabel = hasAnyItemLabel ? \"Item\" : \"Image\";\n            const prefix = isCustomItem(item)\n                ? item.itemLabel?.trim() || \"\"\n                : item.alt?.trim() || \"\";\n            const positionLabel = `${itemTypeLabel} ${index + 1} of ${\n                items.length\n            }.`;\n\n            return prefix ? `${prefix}. ${positionLabel}` : positionLabel;\n        },\n        [items, hasAnyItemLabel]\n    );\n\n    useImperativeHandle<FullscreenImageCarouselRef, FullscreenImageCarouselRef>(\n        ref,\n        () => ({\n            currentItemIndex: currentSlide,\n            setCurrentItem: goToSlide,\n            goToPrevItem: goToPrevSlide,\n            goToNextItem: goToNextSlide,\n        })\n    );\n\n    // =============================================================================\n    // EFFECTS\n    // =============================================================================\n    useEventListener(\"keydown\", handleKeyDown, \"document\");\n\n    useEffect(() => {\n        if (show) {\n            imageRef.current?.focus();\n        }\n    }, [show]);\n\n    useEffect(() => {\n        if (items.length === 0) {\n            setCurrentSlide(0);\n            return;\n        }\n\n        if (currentSlide > items.length - 1) {\n            setCurrentSlide(items.length - 1);\n        }\n    }, [currentSlide, items.length, setCurrentSlide]);\n\n    useEffect(() => {\n        thumbnailRefs.current?.[currentSlide]?.scrollIntoView({\n            behavior: \"smooth\",\n            inline: \"center\",\n        });\n        setZoom(1);\n    }, [currentSlide]);\n\n    // =============================================================================\n    // EVENT HANDLERS\n    // =============================================================================\n    const handleTouchStart = (e: React.TouchEvent) => {\n        if (zoom <= 1) setStartX(e.touches[0].clientX);\n    };\n\n    const handleTouchMove = (e: React.TouchEvent) => {\n        if (!startX || zoom > 1) return;\n        setEndX(e.touches[0].clientX);\n    };\n\n    const handleTouchEnd = () => {\n        if (!containerRef.current) return;\n        if (Math.abs(diff) > containerRef.current.offsetWidth / 3) {\n            if (diff > 0) {\n                goToNextSlide();\n            } else {\n                goToPrevSlide();\n            }\n        }\n        setStartX(undefined);\n        setEndX(undefined);\n    };\n\n    const handleZoom = (e: ReactZoomPanPinchRef) => {\n        setZoom(e.state.scale);\n    };\n\n    const handleDelete = () => {\n        if (currentItem && onDelete) {\n            onDelete(currentItem, currentSlide);\n        }\n    };\n\n    function handleKeyDown(e: KeyboardEvent) {\n        if (e.key === \"ArrowRight\") {\n            goToNextSlide();\n        } else if (e.key === \"ArrowLeft\") {\n            goToPrevSlide();\n        } else if (e.key === \"Escape\") {\n            onClose?.();\n        }\n    }\n\n    const handleMagnifier = () => {\n        if (zoom === 1) {\n            const zoomRatio = getZoomRatio();\n            zoomRefs.current?.[currentSlide]?.centerView(zoomRatio);\n            setZoom(zoomRatio ?? 1);\n        } else {\n            setZoom(1);\n            zoomRefs.current?.[currentSlide]?.resetTransform();\n        }\n    };\n\n    const setDimension = ({\n        src,\n        height,\n        width,\n    }: {\n        src: string;\n        height: number;\n        width: number;\n    }) => {\n        setImageDimension((oldState) => {\n            return { ...oldState, [src]: { height, width } };\n        });\n    };\n\n    const getZoomRatio = () => {\n        if (!currentItem || isCustomItem(currentItem)) {\n            return;\n        }\n\n        const imageDimension = imagesDimension[currentItem.src];\n\n        if (containerRef.current && !!imageDimension) {\n            const { clientHeight, clientWidth } = containerRef.current;\n            const { width, height } = imageDimension;\n            const isSmallImg = width < clientWidth && height < clientHeight;\n\n            const isImgLandscapeRelativeToDevice =\n                height / width < clientHeight / clientWidth;\n\n            if (isSmallImg) {\n                return isImgLandscapeRelativeToDevice\n                    ? clientWidth / width\n                    : clientHeight / height;\n            }\n\n            return isImgLandscapeRelativeToDevice\n                ? clientHeight / (height / (width / clientWidth))\n                : clientWidth / (width / (height / clientHeight));\n        }\n    };\n\n    // =============================================================================\n    // HELPER FUNCTIONS\n    // =============================================================================\n    const goToPrevSlide = () => {\n        zoomRefs.current?.[currentSlide]?.resetTransform();\n        setCurrentSlide(\n            (prev) => (prev === 0 ? items.length - 1 : prev - 1),\n            (slide) => {\n                clearAnnouncer(\"polite\");\n                announce(getItemAriaLabel(slide), \"polite\");\n            }\n        );\n    };\n\n    const goToNextSlide = () => {\n        zoomRefs.current?.[currentSlide]?.resetTransform();\n        setCurrentSlide(\n            (prev) => (prev === items.length - 1 ? 0 : prev + 1),\n            (slide) => {\n                clearAnnouncer(\"polite\");\n                announce(getItemAriaLabel(slide), \"polite\");\n            }\n        );\n    };\n\n    const goToSlide = (index: number) => {\n        zoomRefs.current?.[currentSlide]?.resetTransform();\n        setCurrentSlide(index);\n    };\n\n    // =============================================================================\n    // RENDER FUNCTIONS\n    // =============================================================================\n    const renderSlides = () => {\n        return (\n            <div\n                className={styles.imageGallerySlides}\n                style={{\n                    transform: `translateX(calc(${\n                        -currentSlide * 100\n                    }% - ${diff}px))`,\n                }}\n            >\n                {items.map((item, index) => {\n                    const isActive = index === currentSlide;\n                    const isActiveOrAdjacent =\n                        Math.abs(index - currentSlide) <= 1 ||\n                        (currentSlide === 0 && index === items.length - 1) ||\n                        (currentSlide === items.length - 1 && index === 0);\n\n                    return (\n                        <div\n                            className={styles.imageGallerySlide}\n                            key={index}\n                            data-testid=\"slide-item\"\n                        >\n                            <div\n                                className={styles.focusableImageRegion}\n                                ref={isActive ? imageRef : null}\n                                tabIndex={isActive ? 0 : -1}\n                            >\n                                {isCustomItem(item) ? (\n                                    isActiveOrAdjacent ? (\n                                        item.renderContent()\n                                    ) : (\n                                        <ImagePlaceholder\n                                            className={\n                                                styles.slidePlaceholderImage\n                                            }\n                                        />\n                                    )\n                                ) : (\n                                    <TransformWrapper\n                                        ref={(el) =>\n                                            (zoomRefs.current[index] = el)\n                                        }\n                                        panning={{\n                                            disabled: zoom <= 1,\n                                        }}\n                                        initialScale={1}\n                                        onZoom={handleZoom}\n                                        onZoomStop={handleZoom}\n                                        onWheel={handleZoom}\n                                    >\n                                        <TransformComponent>\n                                            <StatefulImage\n                                                className={styles.slideImage}\n                                                src={item.src}\n                                                alt={getItemAriaLabel(index)}\n                                                placeholder={\n                                                    <ImagePlaceholder\n                                                        className={\n                                                            styles.slidePlaceholderImage\n                                                        }\n                                                    />\n                                                }\n                                                fit=\"scale-down\"\n                                                retrieveImageDimension\n                                                setDimension={setDimension}\n                                            />\n                                        </TransformComponent>\n                                    </TransformWrapper>\n                                )}\n                            </div>\n                        </div>\n                    );\n                })}\n            </div>\n        );\n    };\n\n    const renderFileInfo = () => {\n        const { fileName, fileSize } = currentItem ?? {};\n        const trimmedName = fileName?.trim();\n        const trimmedSize = fileSize?.trim();\n\n        return (\n            <div\n                className={clsx(\n                    styles.fileInfoTextWrapper,\n                    !trimmedSize && styles.fileInfoTextWrapperCentered\n                )}\n                aria-live=\"polite\"\n                aria-atomic=\"true\"\n                data-testid=\"file-info-bar\"\n            >\n                {trimmedName && (\n                    <Typography.BodyBL\n                        className={styles.fileInfoFileName}\n                        weight=\"semibold\"\n                        data-testid=\"file-info-name\"\n                    >\n                        {trimmedName}\n                    </Typography.BodyBL>\n                )}\n                {trimmedSize && (\n                    <Typography.BodyMD\n                        className={styles.fileInfoFileSize}\n                        data-testid=\"file-info-size\"\n                    >\n                        {trimmedSize}\n                    </Typography.BodyMD>\n                )}\n            </div>\n        );\n    };\n\n    const renderThumbnails = () => {\n        return (\n            <div\n                className={styles.thumbnailContainer}\n                ref={thumbnailContainerRef}\n                aria-hidden=\"true\"\n                data-testid=\"thumbnail-container\"\n            >\n                <div className={styles.thumbnailWrapper}>\n                    {items.map((item, index) => {\n                        const src = isCustomItem(item)\n                            ? item.thumbnailSrc\n                            : item.thumbnailSrc ?? item.src;\n                        return (\n                            <div\n                                className={styles.thumbnailItemContainer}\n                                key={index}\n                            >\n                                <div\n                                    className={styles.thumbnailItem}\n                                    data-active={index === currentSlide}\n                                    data-testid=\"thumbnail-item\"\n                                    onClick={() => goToSlide(index)}\n                                    ref={(el) =>\n                                        (thumbnailRefs.current[index] = el)\n                                    }\n                                >\n                                    {src ? (\n                                        <StatefulImage\n                                            className={styles.thumbnailImage}\n                                            src={src}\n                                            alt={`Thumbnail ${index + 1}`}\n                                            fit=\"cover\"\n                                        />\n                                    ) : (\n                                        <ImagePlaceholder\n                                            className={\n                                                styles.slidePlaceholderImage\n                                            }\n                                        />\n                                    )}\n                                </div>\n                            </div>\n                        );\n                    })}\n                </div>\n            </div>\n        );\n    };\n\n    return (\n        <ModalV2\n            {...otherProps}\n            data-testid=\"image-carousel-modal\"\n            aria-label={hasAnyItemLabel ? \"Carousel\" : \"Image carousel\"}\n            show={show}\n            disableInitialFocus\n        >\n            <div className={styles.carouselModalContent}>\n                <div className={styles.imageGalleryContainer}>\n                    <div className={styles.imageGalleryWrapper}>\n                        <div\n                            className={styles.imageGallerySwipe}\n                            ref={containerRef}\n                            onTouchStart={handleTouchStart}\n                            onTouchMove={handleTouchMove}\n                            onTouchEnd={handleTouchEnd}\n                        >\n                            {renderSlides()}\n                        </div>\n\n                        {!hideNavigation && (\n                            <>\n                                <ClickableIcon\n                                    className={clsx(\n                                        styles.iconButton,\n                                        styles.arrowButton,\n                                        styles.arrowButtonLeft\n                                    )}\n                                    ref={prevArrowButtonRef}\n                                    aria-label={`Previous ${carouselItemNoun}`}\n                                    data-testid=\"prev-btn\"\n                                    onClick={goToPrevSlide}\n                                >\n                                    <ChevronLeftIcon aria-hidden />\n                                </ClickableIcon>\n                                <ClickableIcon\n                                    className={clsx(\n                                        styles.iconButton,\n                                        styles.arrowButton,\n                                        styles.arrowButtonRight\n                                    )}\n                                    ref={nextArrowButtonRef}\n                                    aria-label={`Next ${carouselItemNoun}`}\n                                    data-testid=\"forward-btn\"\n                                    onClick={goToNextSlide}\n                                >\n                                    <ChevronRightIcon aria-hidden />\n                                </ClickableIcon>\n                            </>\n                        )}\n\n                        {!hideCounter && (\n                            <div className={styles.boxChip} aria-hidden=\"true\">\n                                <Typography.BodyXS\n                                    className={styles.chip}\n                                    weight=\"semibold\"\n                                    data-testid=\"carousel-counter\"\n                                >{`${currentSlide + 1}/${\n                                    items.length\n                                }`}</Typography.BodyXS>\n                            </div>\n                        )}\n                    </div>\n\n                    {!hideThumbnail && renderThumbnails()}\n                </div>\n                <div\n                    className={styles.topActionButtons}\n                    ref={topActionButtonsRef}\n                    data-has-file-info={hasFileInfo}\n                >\n                    {hasFileInfo && renderFileInfo()}\n                    {!hideMagnifier && !isCustomItem(currentItem) && (\n                        <ClickableIcon\n                            className={styles.iconButton}\n                            aria-label={zoom === 1 ? \"Zoom in\" : \"Zoom out\"}\n                            onClick={handleMagnifier}\n                        >\n                            {zoom === 1 ? (\n                                <MagnifierPlusIcon aria-hidden />\n                            ) : (\n                                <MagnifierMinusIcon aria-hidden />\n                            )}\n                        </ClickableIcon>\n                    )}\n\n                    {onDelete && (\n                        <ClickableIcon\n                            className={clsx(\n                                styles.iconButton,\n                                styles.iconButtonError\n                            )}\n                            aria-label={`Delete ${\n                                (isCustomItem(currentItem) &&\n                                    currentItem.itemLabel?.trim()) ||\n                                \"image\"\n                            }`}\n                            data-testid=\"delete-btn\"\n                            onClick={handleDelete}\n                        >\n                            <BinIcon aria-hidden />\n                        </ClickableIcon>\n                    )}\n\n                    <ClickableIcon\n                        className={styles.iconButton}\n                        aria-label={\n                            hasAnyItemLabel\n                                ? \"Close carousel\"\n                                : \"Close image carousel\"\n                        }\n                        onClick={onClose}\n                    >\n                        <CrossIcon aria-hidden />\n                    </ClickableIcon>\n                </div>\n            </div>\n        </ModalV2>\n    );\n};\n\nexport const FullscreenImageCarousel = forwardRef<\n    FullscreenImageCarouselRef,\n    FullscreenImageCarouselProps\n>(Component);\n"],"names":["isCustomItem","item","type","Component","_a","ref","items","initialActiveItemIndex","hideThumbnail","hideNavigation","hideCounter","hideMagnifier","onDelete","onClose","insets","show","otherProps","__rest","currentSlide","setCurrentSlide","useStateCallback","imagesDimension","setImageDimension","useState","zoom","setZoom","startX","setStartX","endX","setEndX","containerRef","useRef","thumbnailRefs","zoomRefs","imageRef","topActionButtonsRef","prevArrowButtonRef","nextArrowButtonRef","thumbnailContainerRef","diff","currentItem","hasAnyItemLabel","some","itemLabel","trim","carouselItemNoun","hasFileInfo","useMemo","fileName","fileSize","_b","useApplyStyle","styles.tokens","topActionButtons","insetTop","formatUnitValue","top","insetLeft","left","insetRight","right","arrowButton","thumbnailContainer","insetBottom","bottom","getItemAriaLabel","useCallback","index","itemTypeLabel","prefix","alt","positionLabel","length","useImperativeHandle","currentItemIndex","setCurrentItem","goToSlide","goToPrevItem","goToPrevSlide","goToNextItem","goToNextSlide","useEventListener","e","key","useEffect","current","focus","scrollIntoView","behavior","inline","handleZoom","state","scale","setDimension","src","height","width","oldState","Object","assign","getZoomRatio","imageDimension","clientHeight","clientWidth","isImgLandscapeRelativeToDevice","resetTransform","prev","slide","clearAnnouncer","announce","_jsx","ModalV2","disableInitialFocus","_jsxs","className","styles.carouselModalContent","children","styles.imageGalleryContainer","styles.imageGalleryWrapper","styles.imageGallerySwipe","onTouchStart","touches","clientX","onTouchMove","onTouchEnd","Math","abs","offsetWidth","undefined","styles.imageGallerySlides","style","transform","map","isActive","isActiveOrAdjacent","styles.imageGallerySlide","styles.focusableImageRegion","tabIndex","renderContent","ImagePlaceholder","styles.slidePlaceholderImage","TransformWrapper","el","panning","disabled","initialScale","onZoom","onZoomStop","onWheel","TransformComponent","StatefulImage","styles.slideImage","placeholder","fit","retrieveImageDimension","_Fragment","ClickableIcon","clsx","styles.iconButton","styles.arrowButton","styles.arrowButtonLeft","onClick","ChevronLeftIcon","styles.arrowButtonRight","ChevronRightIcon","styles.boxChip","Typography","BodyXS","styles.chip","weight","styles.thumbnailContainer","styles.thumbnailWrapper","thumbnailSrc","styles.thumbnailItemContainer","styles.thumbnailItem","styles.thumbnailImage","styles.topActionButtons","trimmedName","trimmedSize","styles.fileInfoTextWrapper","styles.fileInfoTextWrapperCentered","BodyBL","styles.fileInfoFileName","BodyMD","styles.fileInfoFileSize","renderFileInfo","zoomRatio","centerView","_d","_c","MagnifierPlusIcon","MagnifierMinusIcon","styles.iconButtonError","BinIcon","CrossIcon","FullscreenImageCarousel","forwardRef"],"mappings":"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"}

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

@@ -0,0 +1,40 @@
+export declare const tokens: {
+    topActionButtons: {
+        insetTop: string;
+        insetLeft: string;
+        insetRight: string;
+    };
+    arrowButton: {
+        insetLeft: string;
+        insetRight: string;
+    };
+    thumbnailContainer: {
+        insetBottom: string;
+    };
+};
+export declare const topActionButtons: import("@linaria/core").LinariaClassName;
+export declare const iconButton: import("@linaria/core").LinariaClassName;
+export declare const iconButtonError: import("@linaria/core").LinariaClassName;
+export declare const arrowButton: import("@linaria/core").LinariaClassName;
+export declare const arrowButtonLeft: import("@linaria/core").LinariaClassName;
+export declare const arrowButtonRight: import("@linaria/core").LinariaClassName;
+export declare const carouselModalContent: import("@linaria/core").LinariaClassName;
+export declare const imageGalleryContainer: import("@linaria/core").LinariaClassName;
+export declare const imageGalleryWrapper: import("@linaria/core").LinariaClassName;
+export declare const imageGallerySwipe: import("@linaria/core").LinariaClassName;
+export declare const imageGallerySlides: import("@linaria/core").LinariaClassName;
+export declare const imageGallerySlide: import("@linaria/core").LinariaClassName;
+export declare const focusableImageRegion: import("@linaria/core").LinariaClassName;
+export declare const slideImage: import("@linaria/core").LinariaClassName;
+export declare const slidePlaceholderImage: import("@linaria/core").LinariaClassName;
+export declare const boxChip: import("@linaria/core").LinariaClassName;
+export declare const chip: import("@linaria/core").LinariaClassName;
+export declare const thumbnailContainer: import("@linaria/core").LinariaClassName;
+export declare const thumbnailWrapper: import("@linaria/core").LinariaClassName;
+export declare const thumbnailItemContainer: import("@linaria/core").LinariaClassName;
+export declare const thumbnailItem: import("@linaria/core").LinariaClassName;
+export declare const thumbnailImage: import("@linaria/core").LinariaClassName;
+export declare const fileInfoTextWrapper: import("@linaria/core").LinariaClassName;
+export declare const fileInfoTextWrapperCentered: import("@linaria/core").LinariaClassName;
+export declare const fileInfoFileName: import("@linaria/core").LinariaClassName;
+export declare const fileInfoFileSize: import("@linaria/core").LinariaClassName;

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

@@ -0,0 +1,2 @@
+import"./fullscreen-image-carousel.styles_vc6y5c.css";const t={topActionButtons:{insetTop:"--fds-internal-fullscreenImageCarousel-topActionButtons-insetTop",insetLeft:"--fds-internal-fullscreenImageCarousel-topActionButtons-insetLeft",insetRight:"--fds-internal-fullscreenImageCarousel-topActionButtons-insetRight"},arrowButton:{insetLeft:"--fds-internal-fullscreenImageCarousel-arrowButton-insetLeft",insetRight:"--fds-internal-fullscreenImageCarousel-arrowButton-insetRight"},thumbnailContainer:{insetBottom:"--fds-internal-fullscreenImageCarousel-thumbnailContainer-insetBottom"}},e="t1d7v1ct",n="ijhrw4g",s="i19oam1e",i="aay3qsa",o="a1mt5dqp",l="a1nolxbp",a="c1w96xh3",r="i1cp8dqy",u="ifd12u9",c="i1pu33mh",f="iwm8xb6",m="i1p6ye8c",d="f1wd1tos",p="sd4ndfo",g="sd6bpod",h="b1y1lz2m",w="c1q4y0yr",y="t12djler",B="t15s3u6v",C="t137aivh",b="tlwncl",I="t1uearuq",A="fytebwh",q="f1ysk79e",v="f1cpwiz6",x="f17g5ble";export{i as arrowButton,o as arrowButtonLeft,l as arrowButtonRight,h as boxChip,a as carouselModalContent,w as chip,v as fileInfoFileName,x as fileInfoFileSize,A as fileInfoTextWrapper,q as fileInfoTextWrapperCentered,d as focusableImageRegion,n as iconButton,s as iconButtonError,r as imageGalleryContainer,m as imageGallerySlide,f as imageGallerySlides,c as imageGallerySwipe,u as imageGalleryWrapper,p as slideImage,g as slidePlaceholderImage,y as thumbnailContainer,I as thumbnailImage,b as thumbnailItem,C as thumbnailItemContainer,B as thumbnailWrapper,t as tokens,e as topActionButtons};
+//# sourceMappingURL=fullscreen-image-carousel.styles.js.map