@amboss/design-system 3.35.6 → 3.36.1

package/build/esm/components/Form/DatePicker/DatePickerPopover.d.ts

@@ -0,0 +1,25 @@
+import React from "react";
+import type { CalendarDisplay, CalendarSlotProps } from "./Calendar";
+export type DatePickerPopoverProps = {
+    /** Ref to the element that triggers the calendar (e.g. the calendar icon button). */
+    triggerRef: React.RefObject<HTMLButtonElement>;
+    /** Whether the calendar popover is open. */
+    isVisible: boolean;
+    /** Called when the popover opens or closes. */
+    onVisibilityChange: (visible: boolean, reason: string) => void;
+    /** Currently selected date (or null). Used as initial view and selected state in the calendar. */
+    value: Date | null;
+    /** Called when the user selects a date. */
+    onSelect: (date: Date) => void;
+    /** Display config derived by root (format/locale, week layout). */
+    calendarDisplay: CalendarDisplay;
+    /** Id for the calendar region (used for aria-controls from the trigger button). */
+    id: string;
+    /** Year options for the calendar dropdown. Provided by root. */
+    years: number[];
+    /** Optional test id for the calendar content. */
+    "data-e2e-test-id"?: string;
+    /** Slot props for Calendar. */
+    calendarSlotProps: CalendarSlotProps;
+};
+export declare function DatePickerPopover({ triggerRef, isVisible, onVisibilityChange, value, onSelect, calendarDisplay, id, years, calendarSlotProps, "data-e2e-test-id": dataE2eTestId, }: DatePickerPopoverProps): React.ReactElement;

package/build/esm/components/Form/DatePicker/DatePickerPopover.js

@@ -0,0 +1 @@
+import React from"react";import{BasePopover}from"../../Toggletip/BasePopover";import{Calendar}from"./Calendar";import{Box}from"../../Box/Box";export function DatePickerPopover({triggerRef,isVisible,onVisibilityChange,value,onSelect,calendarDisplay,id,years,calendarSlotProps,"data-e2e-test-id":dataE2eTestId="datepicker-calendar"}){let content=React.createElement(Box,{space:"m"},React.createElement(Calendar,{value:value,onSelect:onSelect,calendarDisplay:calendarDisplay,slotProps:calendarSlotProps,years:years,id:id,"data-e2e-test-id":dataE2eTestId}));return React.createElement(BasePopover,{name:"DatePickerPopover",content:content,externalTriggerRef:triggerRef,isVisible:isVisible,onVisibilityChange:onVisibilityChange,contentPadding:"m",maxWidth:320,placement:"bottom-left",defaultVerticalPlacement:"bottom",role:"dialog",hideArrow:!0,dismissOnOutsideClick:!0,disableInitialFocus:!0})}

package/build/esm/components/Form/DatePicker/dateUtils.d.ts

@@ -0,0 +1,27 @@
+import type { DateFormat } from "../dateMask";
+/** Format a Date to display string per locale (US: MM/DD/YYYY, DE: DD.MM.YYYY, RoW: DD/MM/YYYY). */
+export declare const formatDate: (date: Date, format: DateFormat) => string;
+/** Parse a display string (with separators) or unmasked digits to Date. Returns null if invalid. */
+export declare const parseDate: (value: string, format: DateFormat) => Date | null;
+/** Month names for the calendar dropdown. Derives from format: DE → German, US/RoW → English. Add format in FORMAT_LOCALE for new locales (e.g. ES). */
+export declare const getMonthNames: (format: DateFormat) => string[];
+/** Years from min to max (inclusive). */
+export declare const getYears: (minYear: number, maxYear: number) => number[];
+/** Number of days in the given month (1–31). Month is 1–12. */
+export declare const getDaysInMonth: (year: number, month: number) => number;
+/** First weekday of the month (0 = Sunday, 6 = Saturday). Month is 1–12. */
+export declare const getFirstDayOfMonth: (year: number, month: number) => number;
+/** Weekday labels for the calendar header. DE → Monday first (German), US/RoW → Sunday first (English). Add format in FORMAT_LOCALE for new locales. */
+export declare const getWeekdayLabels: (format: DateFormat) => readonly string[];
+/** Placeholder chars for the date mask (day, month, year). */
+export declare const getPlaceholderChars: (format: DateFormat) => {
+    dayPlaceholderChar: string;
+    monthPlaceholderChar: string;
+    yearPlaceholderChar: string;
+};
+/** Default min year when mask blocks do not specify. Used for calendar year range. */
+export declare const DEFAULT_MIN_YEAR = 1900;
+/** Default max year when mask blocks do not specify. Used for calendar year range. */
+export declare const DEFAULT_MAX_YEAR = 2100;
+/** Whether two dates are the same calendar day. */
+export declare const isSameDay: (a: Date, b: Date) => boolean;

package/build/esm/components/Form/DatePicker/dateUtils.js

@@ -0,0 +1 @@
+let PAD=(n,len)=>String(n).padStart(len,"0");export const formatDate=(date,format)=>{let d=date.getDate(),m=date.getMonth()+1,y=date.getFullYear(),dd=PAD(d,2),mm=PAD(m,2);return"US"===format?`${mm}/${dd}/${y}`:"DE"===format?`${dd}.${mm}.${y}`:"RoW"===format?`${dd}/${mm}/${y}`:`${mm}/${dd}/${y}`};export const parseDate=(value,format)=>{let month,day,year,digits=value.replace(/\D/g,"");if(digits.length<8||("US"===format?(month=parseInt(digits.slice(0,2),10),day=parseInt(digits.slice(2,4),10)):(day=parseInt(digits.slice(0,2),10),month=parseInt(digits.slice(2,4),10)),year=parseInt(digits.slice(4,8),10),month<1||month>12||day<1||day>31))return null;let date=new Date(year,month-1,day);return date.getFullYear()!==year||date.getMonth()!==month-1||date.getDate()!==day?null:date};let FORMAT_LOCALE={US:{locale:"en-US",weekStartsOnMonday:!1},RoW:{locale:"en-GB",weekStartsOnMonday:!1},DE:{locale:"de-DE",weekStartsOnMonday:!0}};export const getMonthNames=format=>{let{locale}=FORMAT_LOCALE[format]??FORMAT_LOCALE.US,formatter=new Intl.DateTimeFormat(locale,{month:"short"});return Array.from({length:12},(_,i)=>formatter.format(new Date(2024,i,1)))};export const getYears=(minYear,maxYear)=>{let years=[];for(let y=minYear;y<=maxYear;y+=1)years.push(y);return years};export const getDaysInMonth=(year,month)=>new Date(year,month,0).getDate();export const getFirstDayOfMonth=(year,month)=>new Date(year,month-1,1).getDay();export const getWeekdayLabels=format=>{let config=FORMAT_LOCALE[format]??FORMAT_LOCALE.US;return function(locale,weekStartsOnMonday){let formatter=new Intl.DateTimeFormat(locale,{weekday:"short"}),sunToSat=Array.from({length:7},(_,i)=>{let date=new Date(2024,0,7+i);return formatter.format(date).slice(0,2).toUpperCase()});return weekStartsOnMonday?[...sunToSat.slice(1),sunToSat[0]]:sunToSat}(config.locale,config.weekStartsOnMonday)};let PLACEHOLDER_CHARS={"en-US":{day:"D",month:"M",year:"Y"},"en-GB":{day:"D",month:"M",year:"Y"},"de-DE":{day:"T",month:"M",year:"J"}};export const getPlaceholderChars=format=>{let{locale}=FORMAT_LOCALE[format]??FORMAT_LOCALE.US,placeholders=PLACEHOLDER_CHARS[locale]??PLACEHOLDER_CHARS["en-US"];return{dayPlaceholderChar:placeholders.day,monthPlaceholderChar:placeholders.month,yearPlaceholderChar:placeholders.year}};export const DEFAULT_MIN_YEAR=1900;export const DEFAULT_MAX_YEAR=2100;export const isSameDay=(a,b)=>a.getFullYear()===b.getFullYear()&&a.getMonth()===b.getMonth()&&a.getDate()===b.getDate();

package/build/esm/components/Form/DatePicker/index.d.ts

@@ -0,0 +1,3 @@
+export { DatePicker } from "./DatePicker";
+export { DatePickerInput } from "./DatePickerInput";
+export type { DatePickerProps } from "./types";

package/build/esm/components/Form/DatePicker/index.js

@@ -0,0 +1 @@
+export{DatePicker}from"./DatePicker";export{DatePickerInput}from"./DatePickerInput";

package/build/esm/components/Form/DatePicker/types.d.ts

@@ -0,0 +1,61 @@
+import type { InputHTMLAttributes } from "react";
+import type { FormFieldProps } from "../FormField/FormField";
+import type { DateFormat, DateMaskBlocks } from "../dateMask";
+import type { CalendarA11yProps } from "./Calendar";
+type DatePickerCalendarA11yProps = Omit<CalendarA11yProps, "formatAriaLabelDay">;
+export type DatePickerProps = {
+    /** Date display format. `"US"` = MM/DD/YYYY, `"DE"` = DD.MM.YYYY, `"RoW"` = DD/MM/YYYY. Default: `"US"`. */
+    format?: DateFormat;
+    /**
+     * Advanced: override IMask blocks for the date mask (e.g. clamp year range).
+     * This affects both the input mask and the calendar year dropdown (derived from `maskBlocks.Y.from/to` when present).
+     */
+    maskBlocks?: DateMaskBlocks;
+    /** Fires whenever the masked value changes (each keystroke or calendar selection). Maps to IMask "accept". */
+    onAccept?: (value: string, unmaskedValue: string, typedValue: string) => void;
+    /** Fires only when the mask is completely filled. Maps to IMask "complete". */
+    onComplete?: (value: string, unmaskedValue: string, typedValue: string) => void;
+    /** Test id for the root form field wrapper. Also supported via FormFieldProps. */
+    "data-e2e-test-id"?: string;
+    /**
+     * Props passed to internal slots (sub-components). Keeps slot-specific props namespaced so the top-level API stays flat for the main contract (format, value, callbacks).
+     *
+     * - `input` — Optional. `placeholder`: when to show mask placeholders (`visible`) and optional custom chars (e.g. for Spanish: D/M/A).
+     * - `calendarButton` — Required. `ariaLabelOpen` and `ariaLabelClose` for screen readers (use app-level translations).
+     *
+     * Note: to constrain the year dropdown (and mask), set `maskBlocks.Y.from/to`.
+     */
+    slotProps: {
+        input?: {
+            /**
+             * Placeholder visibility and optional custom characters for the date mask (day, month, year).
+             * Use this to support other languages (e.g. Spanish: { day: "D", month: "M", year: "A" } for Día/Mes/Año).
+             * Chars default per format/locale (en: D/M/Y, de: T/M/J); only override the keys you need.
+             */
+            placeholder?: {
+                /** When true, shows placeholder characters in empty mask positions. Defaults to false. */
+                visible?: boolean;
+                /** Override placeholder characters. Omit or leave a key undefined to use the locale default. */
+                chars?: {
+                    day?: string;
+                    month?: string;
+                    year?: string;
+                };
+            };
+        };
+        calendarButton: {
+            /** Label for screen readers when the calendar is closed and the button opens it. Provide translated string from your app. */
+            ariaLabelOpen: string;
+            /** Label for screen readers when the calendar is open and the button closes it. Provide translated string from your app. */
+            ariaLabelClose: string;
+        };
+        /** Required. Calendar month/year select and grid labels for screen readers (use app-level translations). */
+        calendar: DatePickerCalendarA11yProps;
+    };
+} & FormFieldProps & Omit<InputHTMLAttributes<HTMLInputElement>, "type" | "onChange" | "value"> & {
+    /** Controlled value (masked string). When provided, the input is controlled. */
+    value?: string;
+    /** When true, shows the input in an error state (e.g. red border). */
+    hasError?: boolean;
+};
+export {};

package/build/esm/components/Form/MaskedInput/MaskedInput.d.ts

@@ -5,9 +5,19 @@ import type { InputProps } from "../Input";
 export { IMask };
 export type MaskedInputProps = {
     maskOptions: FactoryArg;
-    onAccept: (value: string, unmaskedValue: string, typedValue: string) => void;
-} & Omit<InputProps, "type" | "onChange" | "placeholder">;
+    onAccept?: (value: string, unmaskedValue: string, typedValue: string) => void;
+    onComplete?: (value: string, unmaskedValue: string, typedValue: string) => void;
+} & Omit<InputProps, "type" | "onChange" | "size">;
+type UseMaskedInputArgs = {
+    inputRef: React.RefObject<HTMLInputElement>;
+    maskOptions: FactoryArg;
+    value?: string | number | readonly string[];
+    onAccept?: (value: string, unmaskedValue: string, typedValue: string) => void;
+    onComplete?: (value: string, unmaskedValue: string, typedValue: string) => void;
+};
+export declare const useMaskedInput: ({ inputRef, maskOptions, value, onAccept, onComplete, }: UseMaskedInputArgs) => void;
 export declare const MaskedInput: React.ForwardRefExoticComponent<{
     maskOptions: FactoryArg;
-    onAccept: (value: string, unmaskedValue: string, typedValue: string) => void;
-} & Omit<InputProps, "type" | "onChange" | "placeholder"> & React.RefAttributes<HTMLInputElement>>;
+    onAccept?: (value: string, unmaskedValue: string, typedValue: string) => void;
+    onComplete?: (value: string, unmaskedValue: string, typedValue: string) => void;
+} & Omit<InputProps, "type" | "onChange" | "size"> & React.RefAttributes<HTMLInputElement>>;

package/build/esm/components/Form/MaskedInput/MaskedInput.js

@@ -1 +1 @@
-import React,{useRef,useEffect}from"react";import IMask from"imask";import{Input}from"../Input";export const MaskedInput=React.forwardRef(({maskOptions,value,onAccept,...rest},ref)=>{let internalRef=useRef(null),maskRef=useRef(null),inputRef=ref||internalRef;return useEffect(()=>(inputRef?.current&&(maskRef.current=IMask(inputRef.current,maskOptions)),()=>{maskRef.current&&maskRef.current.destroy()}),[inputRef]),useEffect(()=>{maskRef.current.updateOptions(maskOptions)},[maskOptions]),useEffect(()=>{let handleAccept=()=>{onAccept(maskRef.current.value,maskRef.current.unmaskedValue,maskRef.current.typedValue)};return maskRef.current.on("accept",handleAccept),()=>{maskRef.current.off("accept",handleAccept)}},[onAccept]),useEffect(()=>{void 0!==value&&(maskRef.current.value=value)},[value]),React.createElement(Input,{...rest,ref:inputRef,type:"text"})});export{IMask};
+import React,{useRef,useEffect}from"react";import IMask from"imask";import{Input}from"../Input";export const useMaskedInput=({inputRef,maskOptions,value,onAccept,onComplete})=>{let maskRef=useRef(null);useEffect(()=>(inputRef?.current&&(maskRef.current=IMask(inputRef.current,maskOptions)),()=>{maskRef.current&&(maskRef.current.destroy(),maskRef.current=null)}),[inputRef]),useEffect(()=>{maskRef.current&&maskRef.current.updateOptions(maskOptions)},[maskOptions]),useEffect(()=>{if(!maskRef.current||!onAccept)return;let handleAccept=()=>{maskRef.current&&onAccept(maskRef.current.value,maskRef.current.unmaskedValue,maskRef.current.typedValue)};return maskRef.current.on("accept",handleAccept),()=>{maskRef.current?.off("accept",handleAccept)}},[onAccept]),useEffect(()=>{if(!maskRef.current||!onComplete)return;let handleComplete=()=>{maskRef.current&&onComplete(maskRef.current.value,maskRef.current.unmaskedValue,maskRef.current.typedValue)};return maskRef.current.on("complete",handleComplete),()=>{maskRef.current?.off("complete",handleComplete)}},[onComplete]),useEffect(()=>{maskRef.current&&void 0!==value&&(maskRef.current.value=value)},[value])};export const MaskedInput=React.forwardRef(({maskOptions,value,onAccept,onComplete,...rest},ref)=>{let internalRef=useRef(null),inputRef=ref||internalRef;return useMaskedInput({inputRef,maskOptions,value,onAccept,onComplete}),React.createElement(Input,{...rest,ref:inputRef,type:"text"})});export{IMask};

package/build/esm/components/Form/RangeInput/RangeInput.js

@@ -1 +1 @@
-import React,{useMemo,useCallback}from"react";import styled from"@emotion/styled";import{useTheme}from"@emotion/react";import{FormField}from"../FormField/FormField";import{useFormFieldMessageId}from"../FormField/useFormFieldMessageId";let StyledInput=styled("input",{target:"exfgjdf0",label:"StyledInput"})(({theme})=>{let resetStyles={WebkitAppearance:"none",appearance:"none"},thumbStyles={...resetStyles,backgroundColor:theme.values.color.rangeInput.background.thumb.default,boxShadow:theme.values.elevation[3],height:"20px",width:"20px",borderRadius:theme.variables.size.borderRadius.full,border:0};return{...resetStyles,height:"4px",borderRadius:theme.variables.size.borderRadius.xs,cursor:"pointer",width:"100%",margin:`${theme.variables.size.spacing.s} 0 ${theme.variables.size.spacing.m} 0`,"&:disabled":{cursor:"default"},"::-webkit-slider-thumb":thumbStyles,"::-moz-range-thumb":thumbStyles,"::-ms-thumb":thumbStyles}},"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3JjL2NvbXBvbmVudHMvRm9ybS9SYW5nZUlucHV0L1JhbmdlSW5wdXQudHN4Iiwic291cmNlcyI6WyJzcmMvY29tcG9uZW50cy9Gb3JtL1JhbmdlSW5wdXQvUmFuZ2VJbnB1dC50c3giXSwic291cmNlc0NvbnRlbnQiOlsiLyogZXNsaW50LWRpc2FibGUgcmVhY3QvanN4LXByb3BzLW5vLXNwcmVhZGluZyAqL1xuXG5pbXBvcnQgUmVhY3QsIHsgdXNlTWVtbywgdXNlQ2FsbGJhY2ssIHR5cGUgSW5wdXRIVE1MQXR0cmlidXRlcyB9IGZyb20gXCJyZWFjdFwiO1xuaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyB1c2VUaGVtZSB9IGZyb20gXCJAZW1vdGlvbi9yZWFjdFwiO1xuaW1wb3J0IHR5cGUgeyBDU1NPYmplY3QgfSBmcm9tIFwiQGVtb3Rpb24vcmVhY3RcIjtcbmltcG9ydCB0eXBlIHsgRm9ybUZpZWxkUHJvcHMgfSBmcm9tIFwiLi4vRm9ybUZpZWxkL0Zvcm1GaWVsZFwiO1xuaW1wb3J0IHsgRm9ybUZpZWxkIH0gZnJvbSBcIi4uL0Zvcm1GaWVsZC9Gb3JtRmllbGRcIjtcbmltcG9ydCB7IHVzZUZvcm1GaWVsZE1lc3NhZ2VJZCB9IGZyb20gXCIuLi9Gb3JtRmllbGQvdXNlRm9ybUZpZWxkTWVzc2FnZUlkXCI7XG5cbmV4cG9ydCB0eXBlIFJhbmdlSW5wdXRQcm9wcyA9IHtcbiAgLyoqIFRoZSBzdGVwIHNpemUgZm9yIGVhY2ggY2hhbmdlIGluIHRoZSByYW5nZSBpbnB1dCdzIHZhbHVlLiAqL1xuICBoYXNFcnJvcj86IGJvb2xlYW47XG4gIG9uU2xpZGVTdGFydD86IChlOiBSZWFjdC5Gb3JtRXZlbnQ8SFRNTElucHV0RWxlbWVudD4pID0+IHZvaWQ7XG59ICYgRm9ybUZpZWxkUHJvcHMgJlxuICBPbWl0PElucHV0SFRNTEF0dHJpYnV0ZXM8SFRNTElucHV0RWxlbWVudD4sIFwidHlwZVwiPjtcblxuY29uc3QgU3R5bGVkSW5wdXQgPSBzdHlsZWQuaW5wdXQ8UmFuZ2VJbnB1dFByb3BzPigoeyB0aGVtZSB9KSA9PiB7XG4gIGNvbnN0IHJlc2V0U3R5bGVzID0ge1xuICAgIFdlYmtpdEFwcGVhcmFuY2U6IFwibm9uZVwiLFxuICAgIGFwcGVhcmFuY2U6IFwibm9uZVwiLFxuICB9O1xuXG4gIGNvbnN0IHRodW1iU3R5bGVzID0ge1xuICAgIC4uLnJlc2V0U3R5bGVzLFxuICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUudmFsdWVzLmNvbG9yLnJhbmdlSW5wdXQuYmFja2dyb3VuZC50aHVtYi5kZWZhdWx0LFxuICAgIGJveFNoYWRvdzogdGhlbWUudmFsdWVzLmVsZXZhdGlvblszXSxcbiAgICBoZWlnaHQ6IFwiMjBweFwiLFxuICAgIHdpZHRoOiBcIjIwcHhcIixcbiAgICBib3JkZXJSYWRpdXM6IHRoZW1lLnZhcmlhYmxlcy5zaXplLmJvcmRlclJhZGl1cy5mdWxsLFxuICAgIGJvcmRlcjogMCxcbiAgfTtcblxuICByZXR1cm4ge1xuICAgIC4uLnJlc2V0U3R5bGVzLFxuICAgIGhlaWdodDogXCI0cHhcIixcbiAgICBib3JkZXJSYWRpdXM6IHRoZW1lLnZhcmlhYmxlcy5zaXplLmJvcmRlclJhZGl1cy54cyxcbiAgICBjdXJzb3I6IFwicG9pbnRlclwiLFxuICAgIHdpZHRoOiBcIjEwMCVcIixcbiAgICBtYXJnaW46IGAke3RoZW1lLnZhcmlhYmxlcy5zaXplLnNwYWNpbmcuc30gMCAke3RoZW1lLnZhcmlhYmxlcy5zaXplLnNwYWNpbmcubX0gMGAsXG5cbiAgICBcIiY6ZGlzYWJsZWRcIjoge1xuICAgICAgY3Vyc29yOiBcImRlZmF1bHRcIixcbiAgICB9LFxuXG4gICAgXCI6Oi13ZWJraXQtc2xpZGVyLXRodW1iXCI6IHRodW1iU3R5bGVzLFxuICAgIFwiOjotbW96LXJhbmdlLXRodW1iXCI6IHRodW1iU3R5bGVzLFxuICAgIFwiOjotbXMtdGh1bWJcIjogdGh1bWJTdHlsZXMsXG4gIH0gYXMgQ1NTT2JqZWN0O1xufSk7XG5cbmV4cG9ydCBjb25zdCBSYW5nZUlucHV0ID0gUmVhY3QuZm9yd2FyZFJlZihcbiAgKFxuICAgIHtcbiAgICAgIHN0ZXAgPSAxLFxuICAgICAgbWluID0gMCxcbiAgICAgIG1heCA9IDEwMCxcbiAgICAgIHZhbHVlID0gbWluLFxuICAgICAgb25TbGlkZVN0YXJ0LFxuICAgICAgZGlzYWJsZWQsXG4gICAgICBsYWJlbCxcbiAgICAgIGxhYmVsSGludCxcbiAgICAgIGhpZGVMYWJlbCxcbiAgICAgIGVycm9yTWVzc2FnZXMsXG4gICAgICBoaW50LFxuICAgICAgXCJkYXRhLWUyZS10ZXN0LWlkXCI6IGRhdGFFMmVUZXN0SWQsXG4gICAgICBcImFyaWEtZGVzY3JpYmVkYnlcIjogYXJpYURlc2NyaWJlZEJ5LFxuICAgICAgLi4ucmVzdFxuICAgIH06IFJhbmdlSW5wdXRQcm9wcyxcbiAgICByZWY6IFJlYWN0LlJlZk9iamVjdDxIVE1MSW5wdXRFbGVtZW50PlxuICApOiBSZWFjdC5SZWFjdEVsZW1lbnQgPT4ge1xuICAgIGNvbnN0IHRoZW1lID0gdXNlVGhlbWUoKTtcbiAgICBjb25zdCB7IGlkLCBhcmlhRGVzY3JpYmVkQnlQcm9wIH0gPSB1c2VGb3JtRmllbGRNZXNzYWdlSWQoe1xuICAgICAgYXJpYURlc2NyaWJlZEJ5LFxuICAgICAgZXJyb3JNZXNzYWdlcyxcbiAgICAgIGhpbnQsXG4gICAgfSk7XG5cbiAgICBjb25zdCBiYWNrZ3JvdW5kID0gdXNlTWVtbygoKSA9PiB7XG4gICAgICBjb25zdCBwcm9ncmVzcyA9XG4gICAgICAgICgoTnVtYmVyKHZhbHVlKSAtIE51bWJlcihtaW4pKSAvIChOdW1iZXIobWF4KSAtIE51bWJlcihtaW4pKSkgKiAxMDA7XG4gICAgICBjb25zdCBhY2NlbnRCZyA9IHRoZW1lLnZhbHVlcy5jb2xvci5iYWNrZ3JvdW5kLmFjY2VudC5kZWZhdWx0O1xuICAgICAgY29uc3QgcGxhY2Vob2xkZXJCZyA9IHRoZW1lLnZhbHVlcy5jb2xvci5iYWNrZ3JvdW5kLnBsYWNlaG9sZGVyLmRlZmF1bHQ7XG4gICAgICByZXR1cm4gYGxpbmVhci1ncmFkaWVudCh0byByaWdodCwgJHthY2NlbnRCZ30gMCUsICR7YWNjZW50Qmd9ICR7cHJvZ3Jlc3N9JSwgJHtwbGFjZWhvbGRlckJnfSAke3Byb2dyZXNzfSUsICR7cGxhY2Vob2xkZXJCZ30gMTAwJSlgO1xuICAgICAgLy8gZXNsaW50LWRpc2FibGUtbmV4dC1saW5lIHJlYWN0LWhvb2tzL2V4aGF1c3RpdmUtZGVwc1xuICAgIH0sIFt2YWx1ZSwgbWluLCBtYXgsIHRoZW1lLm5hbWVdKTtcblxuICAgIGNvbnN0IGhhbmRsZVNsaWRlU3RhcnQgPSB1c2VDYWxsYmFjayhcbiAgICAgIChlOiBSZWFjdC5Gb3JtRXZlbnQ8SFRNTElucHV0RWxlbWVudD4pID0+IHtcbiAgICAgICAgaWYgKG9uU2xpZGVTdGFydCkge1xuICAgICAgICAgIG9uU2xpZGVTdGFydChlKTtcbiAgICAgICAgfVxuICAgICAgfSxcbiAgICAgIFtvblNsaWRlU3RhcnRdXG4gICAgKTtcblxuICAgIHJldHVybiAoXG4gICAgICA8Rm9ybUZpZWxkXG4gICAgICAgIGRhdGEtZTJlLXRlc3QtaWQ9e2RhdGFFMmVUZXN0SWR9XG4gICAgICAgIGRhdGEtZHMtaWQ9XCJSYW5nZUlucHV0XCJcbiAgICAgICAgZGlzYWJsZWQ9e2Rpc2FibGVkfVxuICAgICAgICBsYWJlbD17bGFiZWx9XG4gICAgICAgIGhpZGVMYWJlbD17aGlkZUxhYmVsfVxuICAgICAgICBsYWJlbEhpbnQ9e2xhYmVsSGludH1cbiAgICAgICAgaGludD17aGludH1cbiAgICAgICAgZXJyb3JNZXNzYWdlcz17ZXJyb3JNZXNzYWdlc31cbiAgICAgICAgbWVzc2FnZUlkPXtpZH1cbiAgICAgID5cbiAgICAgICAgPFN0eWxlZElucHV0XG4gICAgICAgICAgey4uLnJlc3R9XG4gICAgICAgICAgdHlwZT1cInJhbmdlXCJcbiAgICAgICAgICBzdHlsZT17eyBiYWNrZ3JvdW5kIH19XG4gICAgICAgICAgcmVmPXtyZWZ9XG4gICAgICAgICAgdmFsdWU9e3ZhbHVlfVxuICAgICAgICAgIG1pbj17bWlufVxuICAgICAgICAgIG1heD17bWF4fVxuICAgICAgICAgIHN0ZXA9e3N0ZXB9XG4gICAgICAgICAgZGlzYWJsZWQ9e2Rpc2FibGVkfVxuICAgICAgICAgIG9uTW91c2VEb3duPXtoYW5kbGVTbGlkZVN0YXJ0fVxuICAgICAgICAgIG9uVG91Y2hTdGFydD17aGFuZGxlU2xpZGVTdGFydH1cbiAgICAgICAgICB7Li4uYXJpYURlc2NyaWJlZEJ5UHJvcH1cbiAgICAgICAgLz5cbiAgICAgIDwvRm9ybUZpZWxkPlxuICAgICk7XG4gIH1cbik7XG4iXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBaUJvQiJ9 */");export const RangeInput=React.forwardRef(({step=1,min=0,max=100,value=min,onSlideStart,disabled,label,labelHint,hideLabel,errorMessages,hint,"data-e2e-test-id":dataE2eTestId,"aria-describedby":ariaDescribedBy,...rest},ref)=>{let theme=useTheme(),{id,ariaDescribedByProp}=useFormFieldMessageId({ariaDescribedBy,errorMessages,hint}),background=useMemo(()=>{let progress=(Number(value)-Number(min))/(Number(max)-Number(min))*100,accentBg=theme.values.color.background.accent.default,placeholderBg=theme.values.color.background.placeholder.default;return`linear-gradient(to right, ${accentBg} 0%, ${accentBg} ${progress}%, ${placeholderBg} ${progress}%, ${placeholderBg} 100%)`},[value,min,max,theme.name]),handleSlideStart=useCallback(e=>{onSlideStart&&onSlideStart(e)},[onSlideStart]);return React.createElement(FormField,{"data-e2e-test-id":dataE2eTestId,"data-ds-id":"RangeInput",disabled:disabled,label:label,hideLabel:hideLabel,labelHint:labelHint,hint:hint,errorMessages:errorMessages,messageId:id},React.createElement(StyledInput,{...rest,type:"range",style:{background},ref:ref,value:value,min:min,max:max,step:step,disabled:disabled,onMouseDown:handleSlideStart,onTouchStart:handleSlideStart,...ariaDescribedByProp}))});
+import React,{useMemo,useCallback}from"react";import styled from"@emotion/styled";import{useTheme}from"@emotion/react";import{FormField}from"../FormField/FormField";import{useFormFieldMessageId}from"../FormField/useFormFieldMessageId";let StyledInput=styled("input",{target:"e8umilf0",label:"StyledInput"})(({theme})=>{let resetStyles={WebkitAppearance:"none",appearance:"none"},thumbStyles={...resetStyles,backgroundColor:theme.values.color.rangeInput.background.thumb.default,boxShadow:theme.values.elevation[3],height:"20px",width:"20px",borderRadius:theme.variables.size.borderRadius.full,border:0};return{...resetStyles,height:"4px",borderRadius:theme.variables.size.borderRadius.xs,cursor:"pointer",width:"100%",margin:`${theme.variables.size.spacing.s} 0 ${theme.variables.size.spacing.m} 0`,"&:disabled":{cursor:"default"},"::-webkit-slider-thumb":thumbStyles,"::-moz-range-thumb":thumbStyles,"::-ms-thumb":thumbStyles}},"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3JjL2NvbXBvbmVudHMvRm9ybS9SYW5nZUlucHV0L1JhbmdlSW5wdXQudHN4Iiwic291cmNlcyI6WyJzcmMvY29tcG9uZW50cy9Gb3JtL1JhbmdlSW5wdXQvUmFuZ2VJbnB1dC50c3giXSwic291cmNlc0NvbnRlbnQiOlsiLyogZXNsaW50LWRpc2FibGUgcmVhY3QvanN4LXByb3BzLW5vLXNwcmVhZGluZyAqL1xuXG5pbXBvcnQgUmVhY3QsIHsgdXNlTWVtbywgdXNlQ2FsbGJhY2ssIHR5cGUgSW5wdXRIVE1MQXR0cmlidXRlcyB9IGZyb20gXCJyZWFjdFwiO1xuaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyB1c2VUaGVtZSB9IGZyb20gXCJAZW1vdGlvbi9yZWFjdFwiO1xuaW1wb3J0IHR5cGUgeyBDU1NPYmplY3QgfSBmcm9tIFwiQGVtb3Rpb24vcmVhY3RcIjtcbmltcG9ydCB0eXBlIHsgRm9ybUZpZWxkUHJvcHMgfSBmcm9tIFwiLi4vRm9ybUZpZWxkL0Zvcm1GaWVsZFwiO1xuaW1wb3J0IHsgRm9ybUZpZWxkIH0gZnJvbSBcIi4uL0Zvcm1GaWVsZC9Gb3JtRmllbGRcIjtcbmltcG9ydCB7IHVzZUZvcm1GaWVsZE1lc3NhZ2VJZCB9IGZyb20gXCIuLi9Gb3JtRmllbGQvdXNlRm9ybUZpZWxkTWVzc2FnZUlkXCI7XG5cbmV4cG9ydCB0eXBlIFJhbmdlSW5wdXRQcm9wcyA9IHtcbiAgLyoqIFRoZSBzdGVwIHNpemUgZm9yIGVhY2ggY2hhbmdlIGluIHRoZSByYW5nZSBpbnB1dCdzIHZhbHVlLiAqL1xuICBoYXNFcnJvcj86IGJvb2xlYW47XG4gIG9uU2xpZGVTdGFydD86IChlOiBSZWFjdC5Gb3JtRXZlbnQ8SFRNTElucHV0RWxlbWVudD4pID0+IHZvaWQ7XG59ICYgRm9ybUZpZWxkUHJvcHMgJlxuICBPbWl0PElucHV0SFRNTEF0dHJpYnV0ZXM8SFRNTElucHV0RWxlbWVudD4sIFwidHlwZVwiPjtcblxuY29uc3QgU3R5bGVkSW5wdXQgPSBzdHlsZWQuaW5wdXQ8UmFuZ2VJbnB1dFByb3BzPigoeyB0aGVtZSB9KSA9PiB7XG4gIGNvbnN0IHJlc2V0U3R5bGVzID0ge1xuICAgIFdlYmtpdEFwcGVhcmFuY2U6IFwibm9uZVwiLFxuICAgIGFwcGVhcmFuY2U6IFwibm9uZVwiLFxuICB9O1xuXG4gIGNvbnN0IHRodW1iU3R5bGVzID0ge1xuICAgIC4uLnJlc2V0U3R5bGVzLFxuICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUudmFsdWVzLmNvbG9yLnJhbmdlSW5wdXQuYmFja2dyb3VuZC50aHVtYi5kZWZhdWx0LFxuICAgIGJveFNoYWRvdzogdGhlbWUudmFsdWVzLmVsZXZhdGlvblszXSxcbiAgICBoZWlnaHQ6IFwiMjBweFwiLFxuICAgIHdpZHRoOiBcIjIwcHhcIixcbiAgICBib3JkZXJSYWRpdXM6IHRoZW1lLnZhcmlhYmxlcy5zaXplLmJvcmRlclJhZGl1cy5mdWxsLFxuICAgIGJvcmRlcjogMCxcbiAgfTtcblxuICByZXR1cm4ge1xuICAgIC4uLnJlc2V0U3R5bGVzLFxuICAgIGhlaWdodDogXCI0cHhcIixcbiAgICBib3JkZXJSYWRpdXM6IHRoZW1lLnZhcmlhYmxlcy5zaXplLmJvcmRlclJhZGl1cy54cyxcbiAgICBjdXJzb3I6IFwicG9pbnRlclwiLFxuICAgIHdpZHRoOiBcIjEwMCVcIixcbiAgICBtYXJnaW46IGAke3RoZW1lLnZhcmlhYmxlcy5zaXplLnNwYWNpbmcuc30gMCAke3RoZW1lLnZhcmlhYmxlcy5zaXplLnNwYWNpbmcubX0gMGAsXG5cbiAgICBcIiY6ZGlzYWJsZWRcIjoge1xuICAgICAgY3Vyc29yOiBcImRlZmF1bHRcIixcbiAgICB9LFxuXG4gICAgXCI6Oi13ZWJraXQtc2xpZGVyLXRodW1iXCI6IHRodW1iU3R5bGVzLFxuICAgIFwiOjotbW96LXJhbmdlLXRodW1iXCI6IHRodW1iU3R5bGVzLFxuICAgIFwiOjotbXMtdGh1bWJcIjogdGh1bWJTdHlsZXMsXG4gIH0gYXMgQ1NTT2JqZWN0O1xufSk7XG5cbmV4cG9ydCBjb25zdCBSYW5nZUlucHV0ID0gUmVhY3QuZm9yd2FyZFJlZihcbiAgKFxuICAgIHtcbiAgICAgIHN0ZXAgPSAxLFxuICAgICAgbWluID0gMCxcbiAgICAgIG1heCA9IDEwMCxcbiAgICAgIHZhbHVlID0gbWluLFxuICAgICAgaGFzRXJyb3IgPSBmYWxzZSxcbiAgICAgIG9uU2xpZGVTdGFydCxcbiAgICAgIGRpc2FibGVkLFxuICAgICAgbGFiZWwsXG4gICAgICBsYWJlbEhpbnQsXG4gICAgICBoaWRlTGFiZWwsXG4gICAgICBlcnJvck1lc3NhZ2VzLFxuICAgICAgaGludCxcbiAgICAgIFwiZGF0YS1lMmUtdGVzdC1pZFwiOiBkYXRhRTJlVGVzdElkLFxuICAgICAgXCJhcmlhLWRlc2NyaWJlZGJ5XCI6IGFyaWFEZXNjcmliZWRCeSxcbiAgICAgIC4uLnJlc3RcbiAgICB9OiBSYW5nZUlucHV0UHJvcHMsXG4gICAgcmVmOiBSZWFjdC5SZWZPYmplY3Q8SFRNTElucHV0RWxlbWVudD5cbiAgKTogUmVhY3QuUmVhY3RFbGVtZW50ID0+IHtcbiAgICBjb25zdCB0aGVtZSA9IHVzZVRoZW1lKCk7XG4gICAgY29uc3QgeyBpZCwgYXJpYURlc2NyaWJlZEJ5UHJvcCB9ID0gdXNlRm9ybUZpZWxkTWVzc2FnZUlkKHtcbiAgICAgIGFyaWFEZXNjcmliZWRCeSxcbiAgICAgIGVycm9yTWVzc2FnZXMsXG4gICAgICBoaW50LFxuICAgIH0pO1xuXG4gICAgY29uc3QgYmFja2dyb3VuZCA9IHVzZU1lbW8oKCkgPT4ge1xuICAgICAgY29uc3QgcHJvZ3Jlc3MgPVxuICAgICAgICAoKE51bWJlcih2YWx1ZSkgLSBOdW1iZXIobWluKSkgLyAoTnVtYmVyKG1heCkgLSBOdW1iZXIobWluKSkpICogMTAwO1xuICAgICAgY29uc3QgYWNjZW50QmcgPSB0aGVtZS52YWx1ZXMuY29sb3IuYmFja2dyb3VuZC5hY2NlbnQuZGVmYXVsdDtcbiAgICAgIGNvbnN0IHBsYWNlaG9sZGVyQmcgPSB0aGVtZS52YWx1ZXMuY29sb3IuYmFja2dyb3VuZC5wbGFjZWhvbGRlci5kZWZhdWx0O1xuICAgICAgcmV0dXJuIGBsaW5lYXItZ3JhZGllbnQodG8gcmlnaHQsICR7YWNjZW50Qmd9IDAlLCAke2FjY2VudEJnfSAke3Byb2dyZXNzfSUsICR7cGxhY2Vob2xkZXJCZ30gJHtwcm9ncmVzc30lLCAke3BsYWNlaG9sZGVyQmd9IDEwMCUpYDtcbiAgICAgIC8vIGVzbGludC1kaXNhYmxlLW5leHQtbGluZSByZWFjdC1ob29rcy9leGhhdXN0aXZlLWRlcHNcbiAgICB9LCBbdmFsdWUsIG1pbiwgbWF4LCB0aGVtZS5uYW1lXSk7XG5cbiAgICBjb25zdCBoYW5kbGVTbGlkZVN0YXJ0ID0gdXNlQ2FsbGJhY2soXG4gICAgICAoZTogUmVhY3QuRm9ybUV2ZW50PEhUTUxJbnB1dEVsZW1lbnQ+KSA9PiB7XG4gICAgICAgIGlmIChvblNsaWRlU3RhcnQpIHtcbiAgICAgICAgICBvblNsaWRlU3RhcnQoZSk7XG4gICAgICAgIH1cbiAgICAgIH0sXG4gICAgICBbb25TbGlkZVN0YXJ0XVxuICAgICk7XG5cbiAgICByZXR1cm4gKFxuICAgICAgPEZvcm1GaWVsZFxuICAgICAgICBkYXRhLWUyZS10ZXN0LWlkPXtkYXRhRTJlVGVzdElkfVxuICAgICAgICBkYXRhLWRzLWlkPVwiUmFuZ2VJbnB1dFwiXG4gICAgICAgIGRpc2FibGVkPXtkaXNhYmxlZH1cbiAgICAgICAgbGFiZWw9e2xhYmVsfVxuICAgICAgICBoaWRlTGFiZWw9e2hpZGVMYWJlbH1cbiAgICAgICAgbGFiZWxIaW50PXtsYWJlbEhpbnR9XG4gICAgICAgIGhpbnQ9e2hpbnR9XG4gICAgICAgIGVycm9yTWVzc2FnZXM9e2Vycm9yTWVzc2FnZXN9XG4gICAgICAgIG1lc3NhZ2VJZD17aWR9XG4gICAgICA+XG4gICAgICAgIDxTdHlsZWRJbnB1dFxuICAgICAgICAgIHsuLi5yZXN0fVxuICAgICAgICAgIHR5cGU9XCJyYW5nZVwiXG4gICAgICAgICAgc3R5bGU9e3sgYmFja2dyb3VuZCB9fVxuICAgICAgICAgIHJlZj17cmVmfVxuICAgICAgICAgIHZhbHVlPXt2YWx1ZX1cbiAgICAgICAgICBtaW49e21pbn1cbiAgICAgICAgICBtYXg9e21heH1cbiAgICAgICAgICBzdGVwPXtzdGVwfVxuICAgICAgICAgIGRpc2FibGVkPXtkaXNhYmxlZH1cbiAgICAgICAgICBvbk1vdXNlRG93bj17aGFuZGxlU2xpZGVTdGFydH1cbiAgICAgICAgICBvblRvdWNoU3RhcnQ9e2hhbmRsZVNsaWRlU3RhcnR9XG4gICAgICAgICAgYXJpYS1pbnZhbGlkPXtoYXNFcnJvcn1cbiAgICAgICAgICB7Li4uYXJpYURlc2NyaWJlZEJ5UHJvcH1cbiAgICAgICAgLz5cbiAgICAgIDwvRm9ybUZpZWxkPlxuICAgICk7XG4gIH1cbik7XG4iXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBaUJvQiJ9 */");export const RangeInput=React.forwardRef(({step=1,min=0,max=100,value=min,hasError=!1,onSlideStart,disabled,label,labelHint,hideLabel,errorMessages,hint,"data-e2e-test-id":dataE2eTestId,"aria-describedby":ariaDescribedBy,...rest},ref)=>{let theme=useTheme(),{id,ariaDescribedByProp}=useFormFieldMessageId({ariaDescribedBy,errorMessages,hint}),background=useMemo(()=>{let progress=(Number(value)-Number(min))/(Number(max)-Number(min))*100,accentBg=theme.values.color.background.accent.default,placeholderBg=theme.values.color.background.placeholder.default;return`linear-gradient(to right, ${accentBg} 0%, ${accentBg} ${progress}%, ${placeholderBg} ${progress}%, ${placeholderBg} 100%)`},[value,min,max,theme.name]),handleSlideStart=useCallback(e=>{onSlideStart&&onSlideStart(e)},[onSlideStart]);return React.createElement(FormField,{"data-e2e-test-id":dataE2eTestId,"data-ds-id":"RangeInput",disabled:disabled,label:label,hideLabel:hideLabel,labelHint:labelHint,hint:hint,errorMessages:errorMessages,messageId:id},React.createElement(StyledInput,{...rest,type:"range",style:{background},ref:ref,value:value,min:min,max:max,step:step,disabled:disabled,onMouseDown:handleSlideStart,onTouchStart:handleSlideStart,"aria-invalid":hasError,...ariaDescribedByProp}))});

package/build/esm/components/Form/dateMask.d.ts

@@ -2,11 +2,19 @@ import type { FactoryArg } from "imask";
 export type DateFormat = "US" | "DE" | "RoW" | string;
 export declare const FORMAT_TO_MASK: Record<string, string>;
 export declare const FORMAT_TO_LABEL_HINT: Record<string, string>;
+export type DateMaskBlocks = FactoryArg["blocks"];
+/** Reads min/max year from mask blocks (Y.from / Y.to). Used for calendar year range. */
+export declare function getYearRangeFromMaskBlocks(blocks?: DateMaskBlocks): {
+    minYear?: number;
+    maxYear?: number;
+};
 export type DateMaskOptions = {
     format: DateFormat;
     isPlaceholderShown?: boolean;
     dayPlaceholderChar?: string;
     monthPlaceholderChar?: string;
     yearPlaceholderChar?: string;
+    /** Optional overrides for IMask blocks (e.g. to clamp year range). */
+    maskBlocks?: DateMaskBlocks;
 };
-export declare function getMaskOptions({ format, isPlaceholderShown, dayPlaceholderChar, monthPlaceholderChar, yearPlaceholderChar, }: DateMaskOptions): FactoryArg;
+export declare function getMaskOptions({ format, isPlaceholderShown, dayPlaceholderChar, monthPlaceholderChar, yearPlaceholderChar, maskBlocks, }: DateMaskOptions): FactoryArg;

package/build/esm/components/Form/dateMask.js

@@ -1 +1 @@
-import IMask from"imask";export const FORMAT_TO_MASK={US:"m/`d/`Y",DE:"d.`m.`Y",RoW:"d/`m/`Y"};export const FORMAT_TO_LABEL_HINT={US:"MM/DD/YYYY",DE:"TT.MM.JJJJ",RoW:"DD/MM/YYYY"};export function getMaskOptions({format,isPlaceholderShown,dayPlaceholderChar,monthPlaceholderChar,yearPlaceholderChar}){return{mask:FORMAT_TO_MASK[format]||format,lazy:!1,blocks:{d:{mask:IMask.MaskedRange,from:1,to:31,maxLength:2,autofix:"pad",...isPlaceholderShown&&{placeholderChar:dayPlaceholderChar}},m:{mask:IMask.MaskedRange,from:1,to:12,maxLength:2,autofix:"pad",...isPlaceholderShown&&{placeholderChar:monthPlaceholderChar}},Y:{mask:IMask.MaskedRange,from:1900,to:2999,maxLength:4,...isPlaceholderShown&&{placeholderChar:yearPlaceholderChar}}}}}
+import IMask from"imask";export const FORMAT_TO_MASK={US:"m/`d/`Y",DE:"d.`m.`Y",RoW:"d/`m/`Y"};export const FORMAT_TO_LABEL_HINT={US:"MM/DD/YYYY",DE:"TT.MM.JJJJ",RoW:"DD/MM/YYYY"};export function getYearRangeFromMaskBlocks(blocks){if(!blocks?.Y)return{};let y=blocks.Y;return{minYear:"number"==typeof y.from?y.from:void 0,maxYear:"number"==typeof y.to?y.to:void 0}}export function getMaskOptions({format,isPlaceholderShown,dayPlaceholderChar,monthPlaceholderChar,yearPlaceholderChar,maskBlocks}){let mask=FORMAT_TO_MASK[format]||format,baseBlocks={d:{mask:IMask.MaskedRange,from:1,to:31,maxLength:2,autofix:"pad",...isPlaceholderShown&&{placeholderChar:dayPlaceholderChar}},m:{mask:IMask.MaskedRange,from:1,to:12,maxLength:2,autofix:"pad",...isPlaceholderShown&&{placeholderChar:monthPlaceholderChar}},Y:{mask:IMask.MaskedRange,from:1900,to:2999,maxLength:4,...isPlaceholderShown&&{placeholderChar:yearPlaceholderChar}}};return{mask,lazy:!1,blocks:(()=>{if(!maskBlocks)return baseBlocks;let merged={...baseBlocks};return Object.keys(maskBlocks).forEach(key=>{let override=maskBlocks[key];if(!override)return;let base=baseBlocks[key]??{};merged[key]={...base,...override}}),merged})()}}

package/build/esm/components/InteractiveBox/InteractiveBox.d.ts

@@ -10,6 +10,7 @@ export type InteractiveBoxProps = BoxProps & {
     onClick?: (e: React.MouseEvent) => void;
     onFocus?: (e: React.FocusEvent) => void;
     variant?: BaseVariations;
+    tabIndex?: number;
 };
 export declare const InteractiveBox: React.ForwardRefExoticComponent<BoxProps & {
     destructive?: boolean;
@@ -20,4 +21,5 @@ export declare const InteractiveBox: React.ForwardRefExoticComponent<BoxProps &
     onClick?: (e: React.MouseEvent) => void;
     onFocus?: (e: React.FocusEvent) => void;
     variant?: BaseVariations;
+    tabIndex?: number;
 } & React.RefAttributes<HTMLButtonElement>>;

package/build/esm/components/InteractiveBox/InteractiveBox.js

@@ -1 +1 @@
-import React,{forwardRef}from"react";import styled from"@emotion/styled";import isPropValid from"@emotion/is-prop-valid";import{StyledBox}from"../Box/Box";import{getFocusStyles,getDisabledStyles,getPrimaryVariantStyles,getSecondaryVariantStyles,getTertiaryVariantStyles,getButtonAppearanceReset,getBaseButtonStyles,getPressedStyles}from"../../shared/mixins";let StyledInteractiveBox=styled(StyledBox,{shouldForwardProp:prop=>isPropValid(prop)&&"height"!==prop,target:"e1gc97e00",label:"StyledInteractiveBox"})(({theme,variant,disabled,fullWidth,destructive,isPressed})=>({...getButtonAppearanceReset(),...getBaseButtonStyles({theme}),..."primary"===variant&&getPrimaryVariantStyles({theme,destructive,disabled}),..."secondary"===variant&&getSecondaryVariantStyles({theme,disabled}),..."tertiary"===variant&&getTertiaryVariantStyles({theme,destructive,disabled}),...isPressed&&{...getPressedStyles({theme}),"&:active, &:hover":{...getPressedStyles({theme})}},...fullWidth&&{width:"100%"},...getFocusStyles(),...disabled&&{...getDisabledStyles({theme}),cursor:"not-allowed"}}),"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3JjL2NvbXBvbmVudHMvSW50ZXJhY3RpdmVCb3gvSW50ZXJhY3RpdmVCb3gudHN4Iiwic291cmNlcyI6WyJzcmMvY29tcG9uZW50cy9JbnRlcmFjdGl2ZUJveC9JbnRlcmFjdGl2ZUJveC50c3giXSwic291cmNlc0NvbnRlbnQiOlsiLyogZXNsaW50LWRpc2FibGUgcmVhY3QvanN4LXByb3BzLW5vLXNwcmVhZGluZyAqL1xuaW1wb3J0IFJlYWN0LCB7IGZvcndhcmRSZWYgfSBmcm9tIFwicmVhY3RcIjtcbmltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IGlzUHJvcFZhbGlkIGZyb20gXCJAZW1vdGlvbi9pcy1wcm9wLXZhbGlkXCI7XG5cbmltcG9ydCB7IFN0eWxlZEJveCwgdHlwZSBCb3hQcm9wcyB9IGZyb20gXCIuLi9Cb3gvQm94XCI7XG5pbXBvcnQgdHlwZSB7IEJhc2VWYXJpYXRpb25zIH0gZnJvbSBcIi4uLy4uL3R5cGVzXCI7XG5pbXBvcnQge1xuICBnZXRGb2N1c1N0eWxlcyxcbiAgZ2V0RGlzYWJsZWRTdHlsZXMsXG4gIGdldFByaW1hcnlWYXJpYW50U3R5bGVzLFxuICBnZXRTZWNvbmRhcnlWYXJpYW50U3R5bGVzLFxuICBnZXRUZXJ0aWFyeVZhcmlhbnRTdHlsZXMsXG4gIGdldEJ1dHRvbkFwcGVhcmFuY2VSZXNldCxcbiAgZ2V0QmFzZUJ1dHRvblN0eWxlcyxcbiAgZ2V0UHJlc3NlZFN0eWxlcyxcbn0gZnJvbSBcIi4uLy4uL3NoYXJlZC9taXhpbnNcIjtcblxuZXhwb3J0IHR5cGUgSW50ZXJhY3RpdmVCb3hQcm9wcyA9IEJveFByb3BzICYge1xuICBkZXN0cnVjdGl2ZT86IGJvb2xlYW47XG4gIGRpc2FibGVkPzogYm9vbGVhbjtcbiAgZnVsbFdpZHRoPzogYm9vbGVhbjtcbiAgaXNQcmVzc2VkPzogYm9vbGVhbjtcbiAgb25CbHVyPzogKGU6IFJlYWN0LkZvY3VzRXZlbnQpID0+IHZvaWQ7XG4gIG9uQ2xpY2s/OiAoZTogUmVhY3QuTW91c2VFdmVudCkgPT4gdm9pZDtcbiAgb25Gb2N1cz86IChlOiBSZWFjdC5Gb2N1c0V2ZW50KSA9PiB2b2lkO1xuICB2YXJpYW50PzogQmFzZVZhcmlhdGlvbnM7XG59O1xuXG5jb25zdCBTdHlsZWRJbnRlcmFjdGl2ZUJveCA9IHN0eWxlZChTdHlsZWRCb3gsIHtcbiAgc2hvdWxkRm9yd2FyZFByb3A6IChwcm9wKSA9PiBpc1Byb3BWYWxpZChwcm9wKSAmJiBwcm9wICE9PSBcImhlaWdodFwiLFxufSk8SW50ZXJhY3RpdmVCb3hQcm9wcz4oXG4gICh7IHRoZW1lLCB2YXJpYW50LCBkaXNhYmxlZCwgZnVsbFdpZHRoLCBkZXN0cnVjdGl2ZSwgaXNQcmVzc2VkIH0pID0+ICh7XG4gICAgLi4uZ2V0QnV0dG9uQXBwZWFyYW5jZVJlc2V0KCksXG4gICAgLi4uZ2V0QmFzZUJ1dHRvblN0eWxlcyh7IHRoZW1lIH0pLFxuXG4gICAgLi4uKHZhcmlhbnQgPT09IFwicHJpbWFyeVwiICYmXG4gICAgICBnZXRQcmltYXJ5VmFyaWFudFN0eWxlcyh7XG4gICAgICAgIHRoZW1lLFxuICAgICAgICBkZXN0cnVjdGl2ZSxcbiAgICAgICAgZGlzYWJsZWQsXG4gICAgICB9KSksXG5cbiAgICAuLi4odmFyaWFudCA9PT0gXCJzZWNvbmRhcnlcIiAmJlxuICAgICAgZ2V0U2Vjb25kYXJ5VmFyaWFudFN0eWxlcyh7IHRoZW1lLCBkaXNhYmxlZCB9KSksXG5cbiAgICAuLi4odmFyaWFudCA9PT0gXCJ0ZXJ0aWFyeVwiICYmXG4gICAgICBnZXRUZXJ0aWFyeVZhcmlhbnRTdHlsZXMoeyB0aGVtZSwgZGVzdHJ1Y3RpdmUsIGRpc2FibGVkIH0pKSxcblxuICAgIC4uLihpc1ByZXNzZWQgJiYge1xuICAgICAgLi4uZ2V0UHJlc3NlZFN0eWxlcyh7IHRoZW1lIH0pLFxuICAgICAgXCImOmFjdGl2ZSwgJjpob3ZlclwiOiB7XG4gICAgICAgIC4uLmdldFByZXNzZWRTdHlsZXMoeyB0aGVtZSB9KSxcbiAgICAgIH0sXG4gICAgfSksXG5cbiAgICAuLi4oZnVsbFdpZHRoICYmIHtcbiAgICAgIHdpZHRoOiBcIjEwMCVcIixcbiAgICB9KSxcblxuICAgIC4uLmdldEZvY3VzU3R5bGVzKCksXG5cbiAgICAuLi4oZGlzYWJsZWQgJiYge1xuICAgICAgLi4uZ2V0RGlzYWJsZWRTdHlsZXMoeyB0aGVtZSB9KSxcbiAgICAgIGN1cnNvcjogXCJub3QtYWxsb3dlZFwiLFxuICAgIH0pLFxuICB9KVxuKTtcblxuZXhwb3J0IGNvbnN0IEludGVyYWN0aXZlQm94ID0gZm9yd2FyZFJlZihcbiAgKFxuICAgIHtcbiAgICAgIGFsaWduVGV4dCxcbiAgICAgIGJTcGFjZSxcbiAgICAgIGNoaWxkcmVuLFxuICAgICAgZGVzdHJ1Y3RpdmUsXG4gICAgICBkaXNhYmxlZCxcbiAgICAgIGZ1bGxXaWR0aCxcbiAgICAgIGlkLFxuICAgICAgaXNQcmVzc2VkLFxuICAgICAgbFNwYWNlLFxuICAgICAgb25CbHVyLFxuICAgICAgb25DbGljayxcbiAgICAgIG9uRm9jdXMsXG4gICAgICByU3BhY2UsXG4gICAgICBzcGFjZSA9IFwiemVyb1wiLFxuICAgICAgdFNwYWNlLFxuICAgICAgdmFyaWFudCxcbiAgICAgIHZTcGFjZSxcbiAgICAgIGhlaWdodCxcbiAgICAgIFwiZGF0YS1lMmUtdGVzdC1pZFwiOiBkYXRhRTJlVGVzdElkLFxuICAgICAgLi4uYXJpYUF0dHJpYnV0ZXNcbiAgICB9OiBJbnRlcmFjdGl2ZUJveFByb3BzLFxuICAgIHJlZjogUmVhY3QuUmVmPEhUTUxCdXR0b25FbGVtZW50PlxuICApOiBSZWFjdC5SZWFjdEVsZW1lbnQgPT4gKFxuICAgIDxTdHlsZWRJbnRlcmFjdGl2ZUJveFxuICAgICAgcmVmPXtyZWYgYXMgdW5rbm93biBhcyBSZWFjdC5SZWY8SFRNTERpdkVsZW1lbnQ+fVxuICAgICAgYXM9XCJidXR0b25cIlxuICAgICAgdmFyaWFudD17dmFyaWFudH1cbiAgICAgIGRpc2FibGVkPXtkaXNhYmxlZH1cbiAgICAgIGZ1bGxXaWR0aD17ZnVsbFdpZHRofVxuICAgICAgZGVzdHJ1Y3RpdmU9e2Rlc3RydWN0aXZlfVxuICAgICAgc3BhY2U9e3NwYWNlfVxuICAgICAgdlNwYWNlPXt2U3BhY2V9XG4gICAgICByU3BhY2U9e3JTcGFjZX1cbiAgICAgIGxTcGFjZT17bFNwYWNlfVxuICAgICAgdFNwYWNlPXt0U3BhY2V9XG4gICAgICBiU3BhY2U9e2JTcGFjZX1cbiAgICAgIGFsaWduVGV4dD17YWxpZ25UZXh0fVxuICAgICAgaWQ9e2lkfVxuICAgICAgaXNQcmVzc2VkPXtpc1ByZXNzZWR9XG4gICAgICBkYXRhLWUyZS10ZXN0LWlkPXtkYXRhRTJlVGVzdElkfVxuICAgICAgZGF0YS1kcy1pZD1cIkludGVyYWN0aXZlQm94XCJcbiAgICAgIGhlaWdodD17aGVpZ2h0fVxuICAgICAgb25DbGljaz17b25DbGlja31cbiAgICAgIG9uRm9jdXM9e29uRm9jdXN9XG4gICAgICBvbkJsdXI9e29uQmx1cn1cbiAgICAgIHsuLi5hcmlhQXR0cmlidXRlc31cbiAgICAgIGFyaWEtcHJlc3NlZD17aXNQcmVzc2VkID8/IHVuZGVmaW5lZH1cbiAgICA+XG4gICAgICB7Y2hpbGRyZW59XG4gICAgPC9TdHlsZWRJbnRlcmFjdGl2ZUJveD5cbiAgKVxuKTtcbiJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUE2QjZCIn0= */");export const InteractiveBox=forwardRef(({alignText,bSpace,children,destructive,disabled,fullWidth,id,isPressed,lSpace,onBlur,onClick,onFocus,rSpace,space="zero",tSpace,variant,vSpace,height,"data-e2e-test-id":dataE2eTestId,...ariaAttributes},ref)=>React.createElement(StyledInteractiveBox,{ref:ref,as:"button",variant:variant,disabled:disabled,fullWidth:fullWidth,destructive:destructive,space:space,vSpace:vSpace,rSpace:rSpace,lSpace:lSpace,tSpace:tSpace,bSpace:bSpace,alignText:alignText,id:id,isPressed:isPressed,"data-e2e-test-id":dataE2eTestId,"data-ds-id":"InteractiveBox",height:height,onClick:onClick,onFocus:onFocus,onBlur:onBlur,...ariaAttributes,"aria-pressed":isPressed??void 0},children));
+import React,{forwardRef}from"react";import styled from"@emotion/styled";import isPropValid from"@emotion/is-prop-valid";import{StyledBox}from"../Box/Box";import{getFocusStyles,getDisabledStyles,getPrimaryVariantStyles,getSecondaryVariantStyles,getTertiaryVariantStyles,getButtonAppearanceReset,getBaseButtonStyles,getPressedStyles}from"../../shared/mixins";let StyledInteractiveBox=styled(StyledBox,{shouldForwardProp:prop=>isPropValid(prop)&&"height"!==prop,target:"eofirz20",label:"StyledInteractiveBox"})(({theme,variant,disabled,fullWidth,destructive,isPressed})=>({...getButtonAppearanceReset(),...getBaseButtonStyles({theme}),..."primary"===variant&&getPrimaryVariantStyles({theme,destructive,disabled}),..."secondary"===variant&&getSecondaryVariantStyles({theme,disabled}),..."tertiary"===variant&&getTertiaryVariantStyles({theme,destructive,disabled}),...isPressed&&{...getPressedStyles({theme}),"&:active, &:hover":{...getPressedStyles({theme})}},...fullWidth&&{width:"100%"},...getFocusStyles(),...disabled&&{...getDisabledStyles({theme}),cursor:"not-allowed"}}),"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3JjL2NvbXBvbmVudHMvSW50ZXJhY3RpdmVCb3gvSW50ZXJhY3RpdmVCb3gudHN4Iiwic291cmNlcyI6WyJzcmMvY29tcG9uZW50cy9JbnRlcmFjdGl2ZUJveC9JbnRlcmFjdGl2ZUJveC50c3giXSwic291cmNlc0NvbnRlbnQiOlsiLyogZXNsaW50LWRpc2FibGUgcmVhY3QvanN4LXByb3BzLW5vLXNwcmVhZGluZyAqL1xuaW1wb3J0IFJlYWN0LCB7IGZvcndhcmRSZWYgfSBmcm9tIFwicmVhY3RcIjtcbmltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IGlzUHJvcFZhbGlkIGZyb20gXCJAZW1vdGlvbi9pcy1wcm9wLXZhbGlkXCI7XG5cbmltcG9ydCB7IFN0eWxlZEJveCwgdHlwZSBCb3hQcm9wcyB9IGZyb20gXCIuLi9Cb3gvQm94XCI7XG5pbXBvcnQgdHlwZSB7IEJhc2VWYXJpYXRpb25zIH0gZnJvbSBcIi4uLy4uL3R5cGVzXCI7XG5pbXBvcnQge1xuICBnZXRGb2N1c1N0eWxlcyxcbiAgZ2V0RGlzYWJsZWRTdHlsZXMsXG4gIGdldFByaW1hcnlWYXJpYW50U3R5bGVzLFxuICBnZXRTZWNvbmRhcnlWYXJpYW50U3R5bGVzLFxuICBnZXRUZXJ0aWFyeVZhcmlhbnRTdHlsZXMsXG4gIGdldEJ1dHRvbkFwcGVhcmFuY2VSZXNldCxcbiAgZ2V0QmFzZUJ1dHRvblN0eWxlcyxcbiAgZ2V0UHJlc3NlZFN0eWxlcyxcbn0gZnJvbSBcIi4uLy4uL3NoYXJlZC9taXhpbnNcIjtcblxuZXhwb3J0IHR5cGUgSW50ZXJhY3RpdmVCb3hQcm9wcyA9IEJveFByb3BzICYge1xuICBkZXN0cnVjdGl2ZT86IGJvb2xlYW47XG4gIGRpc2FibGVkPzogYm9vbGVhbjtcbiAgZnVsbFdpZHRoPzogYm9vbGVhbjtcbiAgaXNQcmVzc2VkPzogYm9vbGVhbjtcbiAgb25CbHVyPzogKGU6IFJlYWN0LkZvY3VzRXZlbnQpID0+IHZvaWQ7XG4gIG9uQ2xpY2s/OiAoZTogUmVhY3QuTW91c2VFdmVudCkgPT4gdm9pZDtcbiAgb25Gb2N1cz86IChlOiBSZWFjdC5Gb2N1c0V2ZW50KSA9PiB2b2lkO1xuICB2YXJpYW50PzogQmFzZVZhcmlhdGlvbnM7XG4gIHRhYkluZGV4PzogbnVtYmVyO1xufTtcblxuY29uc3QgU3R5bGVkSW50ZXJhY3RpdmVCb3ggPSBzdHlsZWQoU3R5bGVkQm94LCB7XG4gIHNob3VsZEZvcndhcmRQcm9wOiAocHJvcCkgPT4gaXNQcm9wVmFsaWQocHJvcCkgJiYgcHJvcCAhPT0gXCJoZWlnaHRcIixcbn0pPEludGVyYWN0aXZlQm94UHJvcHM+KFxuICAoeyB0aGVtZSwgdmFyaWFudCwgZGlzYWJsZWQsIGZ1bGxXaWR0aCwgZGVzdHJ1Y3RpdmUsIGlzUHJlc3NlZCB9KSA9PiAoe1xuICAgIC4uLmdldEJ1dHRvbkFwcGVhcmFuY2VSZXNldCgpLFxuICAgIC4uLmdldEJhc2VCdXR0b25TdHlsZXMoeyB0aGVtZSB9KSxcblxuICAgIC4uLih2YXJpYW50ID09PSBcInByaW1hcnlcIiAmJlxuICAgICAgZ2V0UHJpbWFyeVZhcmlhbnRTdHlsZXMoe1xuICAgICAgICB0aGVtZSxcbiAgICAgICAgZGVzdHJ1Y3RpdmUsXG4gICAgICAgIGRpc2FibGVkLFxuICAgICAgfSkpLFxuXG4gICAgLi4uKHZhcmlhbnQgPT09IFwic2Vjb25kYXJ5XCIgJiZcbiAgICAgIGdldFNlY29uZGFyeVZhcmlhbnRTdHlsZXMoeyB0aGVtZSwgZGlzYWJsZWQgfSkpLFxuXG4gICAgLi4uKHZhcmlhbnQgPT09IFwidGVydGlhcnlcIiAmJlxuICAgICAgZ2V0VGVydGlhcnlWYXJpYW50U3R5bGVzKHsgdGhlbWUsIGRlc3RydWN0aXZlLCBkaXNhYmxlZCB9KSksXG5cbiAgICAuLi4oaXNQcmVzc2VkICYmIHtcbiAgICAgIC4uLmdldFByZXNzZWRTdHlsZXMoeyB0aGVtZSB9KSxcbiAgICAgIFwiJjphY3RpdmUsICY6aG92ZXJcIjoge1xuICAgICAgICAuLi5nZXRQcmVzc2VkU3R5bGVzKHsgdGhlbWUgfSksXG4gICAgICB9LFxuICAgIH0pLFxuXG4gICAgLi4uKGZ1bGxXaWR0aCAmJiB7XG4gICAgICB3aWR0aDogXCIxMDAlXCIsXG4gICAgfSksXG5cbiAgICAuLi5nZXRGb2N1c1N0eWxlcygpLFxuXG4gICAgLi4uKGRpc2FibGVkICYmIHtcbiAgICAgIC4uLmdldERpc2FibGVkU3R5bGVzKHsgdGhlbWUgfSksXG4gICAgICBjdXJzb3I6IFwibm90LWFsbG93ZWRcIixcbiAgICB9KSxcbiAgfSlcbik7XG5cbmV4cG9ydCBjb25zdCBJbnRlcmFjdGl2ZUJveCA9IGZvcndhcmRSZWYoXG4gIChcbiAgICB7XG4gICAgICBhbGlnblRleHQsXG4gICAgICBiU3BhY2UsXG4gICAgICBjaGlsZHJlbixcbiAgICAgIGRlc3RydWN0aXZlLFxuICAgICAgZGlzYWJsZWQsXG4gICAgICBmdWxsV2lkdGgsXG4gICAgICBpZCxcbiAgICAgIGlzUHJlc3NlZCxcbiAgICAgIGxTcGFjZSxcbiAgICAgIG9uQmx1cixcbiAgICAgIG9uQ2xpY2ssXG4gICAgICBvbkZvY3VzLFxuICAgICAgclNwYWNlLFxuICAgICAgc3BhY2UgPSBcInplcm9cIixcbiAgICAgIHRTcGFjZSxcbiAgICAgIHZhcmlhbnQsXG4gICAgICB2U3BhY2UsXG4gICAgICBoZWlnaHQsXG4gICAgICBcImRhdGEtZTJlLXRlc3QtaWRcIjogZGF0YUUyZVRlc3RJZCxcbiAgICAgIC4uLmFyaWFBdHRyaWJ1dGVzXG4gICAgfTogSW50ZXJhY3RpdmVCb3hQcm9wcyxcbiAgICByZWY6IFJlYWN0LlJlZjxIVE1MQnV0dG9uRWxlbWVudD5cbiAgKTogUmVhY3QuUmVhY3RFbGVtZW50ID0+IChcbiAgICA8U3R5bGVkSW50ZXJhY3RpdmVCb3hcbiAgICAgIHJlZj17cmVmIGFzIHVua25vd24gYXMgUmVhY3QuUmVmPEhUTUxEaXZFbGVtZW50Pn1cbiAgICAgIGFzPVwiYnV0dG9uXCJcbiAgICAgIHZhcmlhbnQ9e3ZhcmlhbnR9XG4gICAgICBkaXNhYmxlZD17ZGlzYWJsZWR9XG4gICAgICBmdWxsV2lkdGg9e2Z1bGxXaWR0aH1cbiAgICAgIGRlc3RydWN0aXZlPXtkZXN0cnVjdGl2ZX1cbiAgICAgIHNwYWNlPXtzcGFjZX1cbiAgICAgIHZTcGFjZT17dlNwYWNlfVxuICAgICAgclNwYWNlPXtyU3BhY2V9XG4gICAgICBsU3BhY2U9e2xTcGFjZX1cbiAgICAgIHRTcGFjZT17dFNwYWNlfVxuICAgICAgYlNwYWNlPXtiU3BhY2V9XG4gICAgICBhbGlnblRleHQ9e2FsaWduVGV4dH1cbiAgICAgIGlkPXtpZH1cbiAgICAgIGlzUHJlc3NlZD17aXNQcmVzc2VkfVxuICAgICAgZGF0YS1lMmUtdGVzdC1pZD17ZGF0YUUyZVRlc3RJZH1cbiAgICAgIGRhdGEtZHMtaWQ9XCJJbnRlcmFjdGl2ZUJveFwiXG4gICAgICBoZWlnaHQ9e2hlaWdodH1cbiAgICAgIG9uQ2xpY2s9e29uQ2xpY2t9XG4gICAgICBvbkZvY3VzPXtvbkZvY3VzfVxuICAgICAgb25CbHVyPXtvbkJsdXJ9XG4gICAgICB7Li4uYXJpYUF0dHJpYnV0ZXN9XG4gICAgICBhcmlhLXByZXNzZWQ9e2lzUHJlc3NlZCA/PyB1bmRlZmluZWR9XG4gICAgPlxuICAgICAge2NoaWxkcmVufVxuICAgIDwvU3R5bGVkSW50ZXJhY3RpdmVCb3g+XG4gIClcbik7XG4iXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBOEI2QiJ9 */");export const InteractiveBox=forwardRef(({alignText,bSpace,children,destructive,disabled,fullWidth,id,isPressed,lSpace,onBlur,onClick,onFocus,rSpace,space="zero",tSpace,variant,vSpace,height,"data-e2e-test-id":dataE2eTestId,...ariaAttributes},ref)=>React.createElement(StyledInteractiveBox,{ref:ref,as:"button",variant:variant,disabled:disabled,fullWidth:fullWidth,destructive:destructive,space:space,vSpace:vSpace,rSpace:rSpace,lSpace:lSpace,tSpace:tSpace,bSpace:bSpace,alignText:alignText,id:id,isPressed:isPressed,"data-e2e-test-id":dataE2eTestId,"data-ds-id":"InteractiveBox",height:height,onClick:onClick,onFocus:onFocus,onBlur:onBlur,...ariaAttributes,"aria-pressed":isPressed??void 0},children));

package/build/esm/components/Lightbox/Lightbox.js

@@ -1,8 +1,8 @@
-import React,{useCallback,useRef}from"react";import styled from"@emotion/styled";import{keyframes}from"@emotion/react";import{Portal,usePortalContainerElement}from"../Portal/Portal";import{FocusTrapWrapper}from"../../shared/FocusTrapWrapper";import{useResponsiveStyles}from"../../shared/mediaQueries";import{DialogContext}from"../Patterns/Dialog/DialogContext";export const StyledBackdrop=styled("div",{target:"e1575mg10",label:"StyledBackdrop"})(({theme,justifyContent})=>{let fadeInBackdrop=keyframes`
+import React,{useCallback,useRef}from"react";import styled from"@emotion/styled";import{keyframes}from"@emotion/react";import{Portal,usePortalContainerElement}from"../Portal/Portal";import{FocusTrapWrapper}from"../../shared/FocusTrapWrapper";import{useResponsiveStyles}from"../../shared/mediaQueries";import{DialogContext}from"../Patterns/Dialog/DialogContext";export const StyledBackdrop=styled("div",{target:"e79ud7r0",label:"StyledBackdrop"})(({theme,justifyContent})=>{let fadeInBackdrop=keyframes`
     from {
       opacity: ${theme.variables.opacity.hidden};
     }
     to {
       opacity: ${theme.variables.opacity.visible};
     }
-  `;return{position:"fixed",top:0,left:0,zIndex:theme.variables.zIndex.modal,width:"100%",height:"100dvh",background:theme.values.color.background.backdrop.default,display:"flex",flexDirection:"column",...useResponsiveStyles({justifyContent:[justifyContent,{top:"flex-start",center:"center"}]}),alignItems:"center",flex:"1 0 auto",animation:`${fadeInBackdrop} ${theme.variables.animation.modalBackdrop.open.duration} ${theme.variables.animation.modalBackdrop.open.timingFunction} both`}},"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3JjL2NvbXBvbmVudHMvTGlnaHRib3gvTGlnaHRib3gudHN4Iiwic291cmNlcyI6WyJzcmMvY29tcG9uZW50cy9MaWdodGJveC9MaWdodGJveC50c3giXSwic291cmNlc0NvbnRlbnQiOlsiLyogZXNsaW50LWRpc2FibGUgcmVhY3QvanN4LXByb3BzLW5vLXNwcmVhZGluZyAqL1xuaW1wb3J0IFJlYWN0LCB7XG4gIHVzZUNhbGxiYWNrLFxuICB1c2VSZWYsXG4gIHR5cGUgUHJvcHNXaXRoQ2hpbGRyZW4sXG4gIHR5cGUgUmVmT2JqZWN0LFxufSBmcm9tIFwicmVhY3RcIjtcbmltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsga2V5ZnJhbWVzIH0gZnJvbSBcIkBlbW90aW9uL3JlYWN0XCI7XG5pbXBvcnQgdHlwZSB7IExpZ2h0Ym94VmVydGljYWxBbGlnbm1lbnQsIE1RIH0gZnJvbSBcInNyYy90eXBlc1wiO1xuaW1wb3J0IHtcbiAgUG9ydGFsLFxuICB1c2VQb3J0YWxDb250YWluZXJFbGVtZW50LFxuICB0eXBlIFBvcnRhbFByb3BzLFxufSBmcm9tIFwiLi4vUG9ydGFsL1BvcnRhbFwiO1xuaW1wb3J0IHsgRm9jdXNUcmFwV3JhcHBlciB9IGZyb20gXCIuLi8uLi9zaGFyZWQvRm9jdXNUcmFwV3JhcHBlclwiO1xuaW1wb3J0IHsgdXNlUmVzcG9uc2l2ZVN0eWxlcyB9IGZyb20gXCIuLi8uLi9zaGFyZWQvbWVkaWFRdWVyaWVzXCI7XG5pbXBvcnQgeyBEaWFsb2dDb250ZXh0IH0gZnJvbSBcIi4uL1BhdHRlcm5zL0RpYWxvZy9EaWFsb2dDb250ZXh0XCI7XG5cbmV4cG9ydCB0eXBlIExpZ2h0Ym94UHJvcHMgPSBSZWFjdC5IVE1MQXR0cmlidXRlczxIVE1MRGl2RWxlbWVudD4gJiB7XG4gIGNoaWxkcmVuPzogUmVhY3QuUmVhY3ROb2RlW10gfCBSZWFjdC5SZWFjdE5vZGU7XG4gIGJhY2tkcm9wUmVmPzogUmVmT2JqZWN0PEhUTUxEaXZFbGVtZW50PjtcbiAgaGFuZGxlQ2xvc2U/OiAoKSA9PiB2b2lkO1xuICBpc0Rpc21pc3NpYmxlPzogYm9vbGVhbjtcbiAganVzdGlmeUNvbnRlbnQ/OiBNUTxMaWdodGJveFZlcnRpY2FsQWxpZ25tZW50PiB8IExpZ2h0Ym94VmVydGljYWxBbGlnbm1lbnQ7XG4gIHByaXZhdGVQcm9wcz86IHtcbiAgICBza2lwUG9ydGFsPzogYm9vbGVhbjtcbiAgICAvKipcbiAgICAgKiBAaW50ZXJuYWxcbiAgICAgKiBPcHRpb25zIHBhc3NlZCB0byBmb2N1cy10cmFwJ3MgdGFiYmFibGUgZGV0ZWN0aW9uLlxuICAgICAqIFVzZSBgeyBkaXNwbGF5Q2hlY2s6IFwibm9uZVwiIH1gIGZvciB0ZXN0aW5nIHRvIGF2b2lkIEpTRE9NIHZpc2liaWxpdHkgaXNzdWVzLlxuICAgICAqL1xuICAgIHRhYmJhYmxlT3B0aW9ucz86IHtcbiAgICAgIGRpc3BsYXlDaGVjaz86IFwiZnVsbFwiIHwgXCJsZWdhY3ktZnVsbFwiIHwgXCJub24temVyby1hcmVhXCIgfCBcIm5vbmVcIjtcbiAgICB9O1xuICB9O1xufSAmIFBpY2s8UG9ydGFsUHJvcHMsIFwicG9ydGFsQ29udGFpbmVyXCI+O1xuXG5leHBvcnQgY29uc3QgU3R5bGVkQmFja2Ryb3AgPSBzdHlsZWQuZGl2PFBpY2s8TGlnaHRib3hQcm9wcywgXCJqdXN0aWZ5Q29udGVudFwiPj4oXG4gICh7IHRoZW1lLCBqdXN0aWZ5Q29udGVudCB9KSA9PiB7XG4gICAgY29uc3QgZmFkZUluQmFja2Ryb3AgPSBrZXlmcmFtZXNgXG4gICAgZnJvbSB7XG4gICAgICBvcGFjaXR5OiAke3RoZW1lLnZhcmlhYmxlcy5vcGFjaXR5LmhpZGRlbn07XG4gICAgfVxuICAgIHRvIHtcbiAgICAgIG9wYWNpdHk6ICR7dGhlbWUudmFyaWFibGVzLm9wYWNpdHkudmlzaWJsZX07XG4gICAgfVxuICBgO1xuXG4gICAgcmV0dXJuIHtcbiAgICAgIHBvc2l0aW9uOiBcImZpeGVkXCIsXG4gICAgICB0b3A6IDAsXG4gICAgICBsZWZ0OiAwLFxuICAgICAgekluZGV4OiB0aGVtZS52YXJpYWJsZXMuekluZGV4Lm1vZGFsLFxuICAgICAgd2lkdGg6IFwiMTAwJVwiLFxuICAgICAgaGVpZ2h0OiBcIjEwMGR2aFwiLFxuICAgICAgYmFja2dyb3VuZDogdGhlbWUudmFsdWVzLmNvbG9yLmJhY2tncm91bmQuYmFja2Ryb3AuZGVmYXVsdCxcbiAgICAgIGRpc3BsYXk6IFwiZmxleFwiLFxuICAgICAgZmxleERpcmVjdGlvbjogXCJjb2x1bW5cIixcbiAgICAgIC4uLnVzZVJlc3BvbnNpdmVTdHlsZXMoe1xuICAgICAgICBqdXN0aWZ5Q29udGVudDogW1xuICAgICAgICAgIGp1c3RpZnlDb250ZW50LFxuICAgICAgICAgIHtcbiAgICAgICAgICAgIHRvcDogXCJmbGV4LXN0YXJ0XCIsXG4gICAgICAgICAgICBjZW50ZXI6IFwiY2VudGVyXCIsXG4gICAgICAgICAgfSxcbiAgICAgICAgXSxcbiAgICAgIH0pLFxuICAgICAgYWxpZ25JdGVtczogXCJjZW50ZXJcIixcbiAgICAgIGZsZXg6IFwiMSAwIGF1dG9cIixcbiAgICAgIGFuaW1hdGlvbjogYCR7ZmFkZUluQmFja2Ryb3B9ICR7dGhlbWUudmFyaWFibGVzLmFuaW1hdGlvbi5tb2RhbEJhY2tkcm9wLm9wZW4uZHVyYXRpb259ICR7dGhlbWUudmFyaWFibGVzLmFuaW1hdGlvbi5tb2RhbEJhY2tkcm9wLm9wZW4udGltaW5nRnVuY3Rpb259IGJvdGhgLFxuICAgIH07XG4gIH1cbik7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRDaGlsZHJlbldyYXBwZXIgPSBzdHlsZWQuZGl2KHtcbiAgZGlzcGxheTogXCJjb250ZW50c1wiLFxufSk7XG5cbmV4cG9ydCBmdW5jdGlvbiBMaWdodGJveCh7XG4gIGJhY2tkcm9wUmVmLFxuICBwb3J0YWxDb250YWluZXIsXG4gIGlzRGlzbWlzc2libGUgPSB0cnVlLFxuICBjaGlsZHJlbixcbiAgaGFuZGxlQ2xvc2UsXG4gIGp1c3RpZnlDb250ZW50ID0gXCJjZW50ZXJcIixcbiAgcHJpdmF0ZVByb3BzOiB7IHNraXBQb3J0YWwsIHRhYmJhYmxlT3B0aW9ucyB9ID0ge1xuICAgIHNraXBQb3J0YWw6IGZhbHNlLFxuICB9LFxufTogUHJvcHNXaXRoQ2hpbGRyZW48TGlnaHRib3hQcm9wcz4pOiBSZWFjdC5SZWFjdEVsZW1lbnQge1xuICBjb25zdCBwb3J0YWxDb250YWluZXJFbGVtZW50ID0gdXNlUG9ydGFsQ29udGFpbmVyRWxlbWVudChwb3J0YWxDb250YWluZXIpO1xuICBjb25zdCBtb2RhbFJlZiA9IHVzZVJlZihudWxsKTtcblxuICBjb25zdCBoYW5kbGVDbGlja091dHNpZGVEZWFjdGl2YXRlcyA9IHVzZUNhbGxiYWNrKFxuICAgIChldnQ6IE1vdXNlRXZlbnQgfCBUb3VjaEV2ZW50KSA9PiB7XG4gICAgICAvLyBEbyBub3QgY2xvc2Ugb24gY2xpY2sgdGhhdCBvY2N1cnMgb24gZWxlbWVudHMgd2l0aGluIHRoZSBzYW1lIHBvcnRhbCwgZm9yIGVnLCBkcm9wZG93biBhbmQgc2VsZWN0IG1lbnVzXG4gICAgICBpZiAoXG4gICAgICAgIHBvcnRhbENvbnRhaW5lckVsZW1lbnQuY29udGFpbnMoZXZ0LnRhcmdldCBhcyBIVE1MRWxlbWVudCkgJiZcbiAgICAgICAgZXZ0LnRhcmdldCAhPT0gYmFja2Ryb3BSZWY/LmN1cnJlbnRcbiAgICAgICkge1xuICAgICAgICByZXR1cm4gZmFsc2U7XG4gICAgICB9XG5cbiAgICAgIHJldHVybiBpc0Rpc21pc3NpYmxlO1xuICAgIH0sXG4gICAgW2JhY2tkcm9wUmVmLCBwb3J0YWxDb250YWluZXJFbGVtZW50LCBpc0Rpc21pc3NpYmxlXVxuICApO1xuXG4gIGNvbnN0IGNvbnRlbnQgPSAoXG4gICAgPFN0eWxlZEJhY2tkcm9wXG4gICAgICByZWY9e2JhY2tkcm9wUmVmfVxuICAgICAganVzdGlmeUNvbnRlbnQ9e2p1c3RpZnlDb250ZW50fVxuICAgICAgZGF0YS1kcy1pZD1cIkxpZ2h0Ym94XCJcbiAgICA+XG4gICAgICA8Rm9jdXNUcmFwV3JhcHBlclxuICAgICAgICBhY3RpdmVcbiAgICAgICAgZm9jdXNUcmFwT3B0aW9ucz17e1xuICAgICAgICAgIGFsbG93T3V0c2lkZUNsaWNrOiB0cnVlLCAvLyBhbGxvdyBjbGljayBvbiBtb2JpbGUgaW4gYW55IGRyb3Bkb3duc1xuICAgICAgICAgIGNsaWNrT3V0c2lkZURlYWN0aXZhdGVzOiBoYW5kbGVDbGlja091dHNpZGVEZWFjdGl2YXRlcyxcbiAgICAgICAgICBlc2NhcGVEZWFjdGl2YXRlczogaXNEaXNtaXNzaWJsZSwgLy8gZGUtYWN0aXZhdGUgZm9jdXMgdHJhcCBvbiBlc2NhcGUga2V5XG4gICAgICAgICAgcHJldmVudFNjcm9sbDogdHJ1ZSxcbiAgICAgICAgICBmYWxsYmFja0ZvY3VzOiAoKSA9PiBtb2RhbFJlZj8uY3VycmVudCB8fCBkb2N1bWVudC5ib2R5LFxuICAgICAgICAgIC4uLih0YWJiYWJsZU9wdGlvbnMgJiYgeyB0YWJiYWJsZU9wdGlvbnMgfSksXG4gICAgICAgICAgLi4uKGhhbmRsZUNsb3NlICYmIHsgb25Qb3N0RGVhY3RpdmF0ZTogaGFuZGxlQ2xvc2UgfSksXG4gICAgICAgIH19XG4gICAgICA+XG4gICAgICAgIDxTdHlsZWRDaGlsZHJlbldyYXBwZXIgcmVmPXttb2RhbFJlZn0+XG4gICAgICAgICAgPERpYWxvZ0NvbnRleHQuUHJvdmlkZXIgdmFsdWU+e2NoaWxkcmVufTwvRGlhbG9nQ29udGV4dC5Qcm92aWRlcj5cbiAgICAgICAgPC9TdHlsZWRDaGlsZHJlbldyYXBwZXI+XG4gICAgICA8L0ZvY3VzVHJhcFdyYXBwZXI+XG4gICAgPC9TdHlsZWRCYWNrZHJvcD5cbiAgKTtcblxuICAvLyBGb3IgdGVzdGluZyBhbmQgTW9kYWwgc3Rvcnkgd2UgZG9uJ3Qgd2FudCB0byByZW5kZXIgdGhlIGNvbnRlbnQgaW5zaWRlIGEgcG9ydGFsXG4gIGlmIChza2lwUG9ydGFsKSB7XG4gICAgcmV0dXJuIGNvbnRlbnQ7XG4gIH1cblxuICByZXR1cm4gPFBvcnRhbCBwb3J0YWxDb250YWluZXI9e3BvcnRhbENvbnRhaW5lcn0+e2NvbnRlbnR9PC9Qb3J0YWw+O1xufVxuIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXNDOEIifQ== */");export const StyledChildrenWrapper=styled("div",{target:"e1575mg11",label:"StyledChildrenWrapper"})({display:"contents"},"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3JjL2NvbXBvbmVudHMvTGlnaHRib3gvTGlnaHRib3gudHN4Iiwic291cmNlcyI6WyJzcmMvY29tcG9uZW50cy9MaWdodGJveC9MaWdodGJveC50c3giXSwic291cmNlc0NvbnRlbnQiOlsiLyogZXNsaW50LWRpc2FibGUgcmVhY3QvanN4LXByb3BzLW5vLXNwcmVhZGluZyAqL1xuaW1wb3J0IFJlYWN0LCB7XG4gIHVzZUNhbGxiYWNrLFxuICB1c2VSZWYsXG4gIHR5cGUgUHJvcHNXaXRoQ2hpbGRyZW4sXG4gIHR5cGUgUmVmT2JqZWN0LFxufSBmcm9tIFwicmVhY3RcIjtcbmltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsga2V5ZnJhbWVzIH0gZnJvbSBcIkBlbW90aW9uL3JlYWN0XCI7XG5pbXBvcnQgdHlwZSB7IExpZ2h0Ym94VmVydGljYWxBbGlnbm1lbnQsIE1RIH0gZnJvbSBcInNyYy90eXBlc1wiO1xuaW1wb3J0IHtcbiAgUG9ydGFsLFxuICB1c2VQb3J0YWxDb250YWluZXJFbGVtZW50LFxuICB0eXBlIFBvcnRhbFByb3BzLFxufSBmcm9tIFwiLi4vUG9ydGFsL1BvcnRhbFwiO1xuaW1wb3J0IHsgRm9jdXNUcmFwV3JhcHBlciB9IGZyb20gXCIuLi8uLi9zaGFyZWQvRm9jdXNUcmFwV3JhcHBlclwiO1xuaW1wb3J0IHsgdXNlUmVzcG9uc2l2ZVN0eWxlcyB9IGZyb20gXCIuLi8uLi9zaGFyZWQvbWVkaWFRdWVyaWVzXCI7XG5pbXBvcnQgeyBEaWFsb2dDb250ZXh0IH0gZnJvbSBcIi4uL1BhdHRlcm5zL0RpYWxvZy9EaWFsb2dDb250ZXh0XCI7XG5cbmV4cG9ydCB0eXBlIExpZ2h0Ym94UHJvcHMgPSBSZWFjdC5IVE1MQXR0cmlidXRlczxIVE1MRGl2RWxlbWVudD4gJiB7XG4gIGNoaWxkcmVuPzogUmVhY3QuUmVhY3ROb2RlW10gfCBSZWFjdC5SZWFjdE5vZGU7XG4gIGJhY2tkcm9wUmVmPzogUmVmT2JqZWN0PEhUTUxEaXZFbGVtZW50PjtcbiAgaGFuZGxlQ2xvc2U/OiAoKSA9PiB2b2lkO1xuICBpc0Rpc21pc3NpYmxlPzogYm9vbGVhbjtcbiAganVzdGlmeUNvbnRlbnQ/OiBNUTxMaWdodGJveFZlcnRpY2FsQWxpZ25tZW50PiB8IExpZ2h0Ym94VmVydGljYWxBbGlnbm1lbnQ7XG4gIHByaXZhdGVQcm9wcz86IHtcbiAgICBza2lwUG9ydGFsPzogYm9vbGVhbjtcbiAgICAvKipcbiAgICAgKiBAaW50ZXJuYWxcbiAgICAgKiBPcHRpb25zIHBhc3NlZCB0byBmb2N1cy10cmFwJ3MgdGFiYmFibGUgZGV0ZWN0aW9uLlxuICAgICAqIFVzZSBgeyBkaXNwbGF5Q2hlY2s6IFwibm9uZVwiIH1gIGZvciB0ZXN0aW5nIHRvIGF2b2lkIEpTRE9NIHZpc2liaWxpdHkgaXNzdWVzLlxuICAgICAqL1xuICAgIHRhYmJhYmxlT3B0aW9ucz86IHtcbiAgICAgIGRpc3BsYXlDaGVjaz86IFwiZnVsbFwiIHwgXCJsZWdhY3ktZnVsbFwiIHwgXCJub24temVyby1hcmVhXCIgfCBcIm5vbmVcIjtcbiAgICB9O1xuICB9O1xufSAmIFBpY2s8UG9ydGFsUHJvcHMsIFwicG9ydGFsQ29udGFpbmVyXCI+O1xuXG5leHBvcnQgY29uc3QgU3R5bGVkQmFja2Ryb3AgPSBzdHlsZWQuZGl2PFBpY2s8TGlnaHRib3hQcm9wcywgXCJqdXN0aWZ5Q29udGVudFwiPj4oXG4gICh7IHRoZW1lLCBqdXN0aWZ5Q29udGVudCB9KSA9PiB7XG4gICAgY29uc3QgZmFkZUluQmFja2Ryb3AgPSBrZXlmcmFtZXNgXG4gICAgZnJvbSB7XG4gICAgICBvcGFjaXR5OiAke3RoZW1lLnZhcmlhYmxlcy5vcGFjaXR5LmhpZGRlbn07XG4gICAgfVxuICAgIHRvIHtcbiAgICAgIG9wYWNpdHk6ICR7dGhlbWUudmFyaWFibGVzLm9wYWNpdHkudmlzaWJsZX07XG4gICAgfVxuICBgO1xuXG4gICAgcmV0dXJuIHtcbiAgICAgIHBvc2l0aW9uOiBcImZpeGVkXCIsXG4gICAgICB0b3A6IDAsXG4gICAgICBsZWZ0OiAwLFxuICAgICAgekluZGV4OiB0aGVtZS52YXJpYWJsZXMuekluZGV4Lm1vZGFsLFxuICAgICAgd2lkdGg6IFwiMTAwJVwiLFxuICAgICAgaGVpZ2h0OiBcIjEwMGR2aFwiLFxuICAgICAgYmFja2dyb3VuZDogdGhlbWUudmFsdWVzLmNvbG9yLmJhY2tncm91bmQuYmFja2Ryb3AuZGVmYXVsdCxcbiAgICAgIGRpc3BsYXk6IFwiZmxleFwiLFxuICAgICAgZmxleERpcmVjdGlvbjogXCJjb2x1bW5cIixcbiAgICAgIC4uLnVzZVJlc3BvbnNpdmVTdHlsZXMoe1xuICAgICAgICBqdXN0aWZ5Q29udGVudDogW1xuICAgICAgICAgIGp1c3RpZnlDb250ZW50LFxuICAgICAgICAgIHtcbiAgICAgICAgICAgIHRvcDogXCJmbGV4LXN0YXJ0XCIsXG4gICAgICAgICAgICBjZW50ZXI6IFwiY2VudGVyXCIsXG4gICAgICAgICAgfSxcbiAgICAgICAgXSxcbiAgICAgIH0pLFxuICAgICAgYWxpZ25JdGVtczogXCJjZW50ZXJcIixcbiAgICAgIGZsZXg6IFwiMSAwIGF1dG9cIixcbiAgICAgIGFuaW1hdGlvbjogYCR7ZmFkZUluQmFja2Ryb3B9ICR7dGhlbWUudmFyaWFibGVzLmFuaW1hdGlvbi5tb2RhbEJhY2tkcm9wLm9wZW4uZHVyYXRpb259ICR7dGhlbWUudmFyaWFibGVzLmFuaW1hdGlvbi5tb2RhbEJhY2tkcm9wLm9wZW4udGltaW5nRnVuY3Rpb259IGJvdGhgLFxuICAgIH07XG4gIH1cbik7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRDaGlsZHJlbldyYXBwZXIgPSBzdHlsZWQuZGl2KHtcbiAgZGlzcGxheTogXCJjb250ZW50c1wiLFxufSk7XG5cbmV4cG9ydCBmdW5jdGlvbiBMaWdodGJveCh7XG4gIGJhY2tkcm9wUmVmLFxuICBwb3J0YWxDb250YWluZXIsXG4gIGlzRGlzbWlzc2libGUgPSB0cnVlLFxuICBjaGlsZHJlbixcbiAgaGFuZGxlQ2xvc2UsXG4gIGp1c3RpZnlDb250ZW50ID0gXCJjZW50ZXJcIixcbiAgcHJpdmF0ZVByb3BzOiB7IHNraXBQb3J0YWwsIHRhYmJhYmxlT3B0aW9ucyB9ID0ge1xuICAgIHNraXBQb3J0YWw6IGZhbHNlLFxuICB9LFxufTogUHJvcHNXaXRoQ2hpbGRyZW48TGlnaHRib3hQcm9wcz4pOiBSZWFjdC5SZWFjdEVsZW1lbnQge1xuICBjb25zdCBwb3J0YWxDb250YWluZXJFbGVtZW50ID0gdXNlUG9ydGFsQ29udGFpbmVyRWxlbWVudChwb3J0YWxDb250YWluZXIpO1xuICBjb25zdCBtb2RhbFJlZiA9IHVzZVJlZihudWxsKTtcblxuICBjb25zdCBoYW5kbGVDbGlja091dHNpZGVEZWFjdGl2YXRlcyA9IHVzZUNhbGxiYWNrKFxuICAgIChldnQ6IE1vdXNlRXZlbnQgfCBUb3VjaEV2ZW50KSA9PiB7XG4gICAgICAvLyBEbyBub3QgY2xvc2Ugb24gY2xpY2sgdGhhdCBvY2N1cnMgb24gZWxlbWVudHMgd2l0aGluIHRoZSBzYW1lIHBvcnRhbCwgZm9yIGVnLCBkcm9wZG93biBhbmQgc2VsZWN0IG1lbnVzXG4gICAgICBpZiAoXG4gICAgICAgIHBvcnRhbENvbnRhaW5lckVsZW1lbnQuY29udGFpbnMoZXZ0LnRhcmdldCBhcyBIVE1MRWxlbWVudCkgJiZcbiAgICAgICAgZXZ0LnRhcmdldCAhPT0gYmFja2Ryb3BSZWY/LmN1cnJlbnRcbiAgICAgICkge1xuICAgICAgICByZXR1cm4gZmFsc2U7XG4gICAgICB9XG5cbiAgICAgIHJldHVybiBpc0Rpc21pc3NpYmxlO1xuICAgIH0sXG4gICAgW2JhY2tkcm9wUmVmLCBwb3J0YWxDb250YWluZXJFbGVtZW50LCBpc0Rpc21pc3NpYmxlXVxuICApO1xuXG4gIGNvbnN0IGNvbnRlbnQgPSAoXG4gICAgPFN0eWxlZEJhY2tkcm9wXG4gICAgICByZWY9e2JhY2tkcm9wUmVmfVxuICAgICAganVzdGlmeUNvbnRlbnQ9e2p1c3RpZnlDb250ZW50fVxuICAgICAgZGF0YS1kcy1pZD1cIkxpZ2h0Ym94XCJcbiAgICA+XG4gICAgICA8Rm9jdXNUcmFwV3JhcHBlclxuICAgICAgICBhY3RpdmVcbiAgICAgICAgZm9jdXNUcmFwT3B0aW9ucz17e1xuICAgICAgICAgIGFsbG93T3V0c2lkZUNsaWNrOiB0cnVlLCAvLyBhbGxvdyBjbGljayBvbiBtb2JpbGUgaW4gYW55IGRyb3Bkb3duc1xuICAgICAgICAgIGNsaWNrT3V0c2lkZURlYWN0aXZhdGVzOiBoYW5kbGVDbGlja091dHNpZGVEZWFjdGl2YXRlcyxcbiAgICAgICAgICBlc2NhcGVEZWFjdGl2YXRlczogaXNEaXNtaXNzaWJsZSwgLy8gZGUtYWN0aXZhdGUgZm9jdXMgdHJhcCBvbiBlc2NhcGUga2V5XG4gICAgICAgICAgcHJldmVudFNjcm9sbDogdHJ1ZSxcbiAgICAgICAgICBmYWxsYmFja0ZvY3VzOiAoKSA9PiBtb2RhbFJlZj8uY3VycmVudCB8fCBkb2N1bWVudC5ib2R5LFxuICAgICAgICAgIC4uLih0YWJiYWJsZU9wdGlvbnMgJiYgeyB0YWJiYWJsZU9wdGlvbnMgfSksXG4gICAgICAgICAgLi4uKGhhbmRsZUNsb3NlICYmIHsgb25Qb3N0RGVhY3RpdmF0ZTogaGFuZGxlQ2xvc2UgfSksXG4gICAgICAgIH19XG4gICAgICA+XG4gICAgICAgIDxTdHlsZWRDaGlsZHJlbldyYXBwZXIgcmVmPXttb2RhbFJlZn0+XG4gICAgICAgICAgPERpYWxvZ0NvbnRleHQuUHJvdmlkZXIgdmFsdWU+e2NoaWxkcmVufTwvRGlhbG9nQ29udGV4dC5Qcm92aWRlcj5cbiAgICAgICAgPC9TdHlsZWRDaGlsZHJlbldyYXBwZXI+XG4gICAgICA8L0ZvY3VzVHJhcFdyYXBwZXI+XG4gICAgPC9TdHlsZWRCYWNrZHJvcD5cbiAgKTtcblxuICAvLyBGb3IgdGVzdGluZyBhbmQgTW9kYWwgc3Rvcnkgd2UgZG9uJ3Qgd2FudCB0byByZW5kZXIgdGhlIGNvbnRlbnQgaW5zaWRlIGEgcG9ydGFsXG4gIGlmIChza2lwUG9ydGFsKSB7XG4gICAgcmV0dXJuIGNvbnRlbnQ7XG4gIH1cblxuICByZXR1cm4gPFBvcnRhbCBwb3J0YWxDb250YWluZXI9e3BvcnRhbENvbnRhaW5lcn0+e2NvbnRlbnR9PC9Qb3J0YWw+O1xufVxuIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQTJFcUMifQ== */");export function Lightbox({backdropRef,portalContainer,isDismissible=!0,children,handleClose,justifyContent="center",privateProps:{skipPortal,tabbableOptions}={skipPortal:!1}}){let portalContainerElement=usePortalContainerElement(portalContainer),modalRef=useRef(null),handleClickOutsideDeactivates=useCallback(evt=>(!portalContainerElement.contains(evt.target)||evt.target===backdropRef?.current)&&isDismissible,[backdropRef,portalContainerElement,isDismissible]),content=React.createElement(StyledBackdrop,{ref:backdropRef,justifyContent:justifyContent,"data-ds-id":"Lightbox"},React.createElement(FocusTrapWrapper,{active:!0,focusTrapOptions:{allowOutsideClick:!0,clickOutsideDeactivates:handleClickOutsideDeactivates,escapeDeactivates:isDismissible,preventScroll:!0,fallbackFocus:()=>modalRef?.current||document.body,...tabbableOptions&&{tabbableOptions},...handleClose&&{onPostDeactivate:handleClose}}},React.createElement(StyledChildrenWrapper,{ref:modalRef},React.createElement(DialogContext.Provider,{value:!0},children))));return skipPortal?content:React.createElement(Portal,{portalContainer:portalContainer},content)}
+  `;return{position:"fixed",top:0,left:0,zIndex:theme.variables.zIndex.modal,width:"100%",height:"100dvh",background:theme.values.color.background.backdrop.default,display:"flex",flexDirection:"column",...useResponsiveStyles({justifyContent:[justifyContent,{top:"flex-start",center:"center"}]}),alignItems:"center",flex:"1 0 auto",animation:`${fadeInBackdrop} ${theme.variables.animation.modalBackdrop.open.duration} ${theme.variables.animation.modalBackdrop.open.timingFunction} both`}},"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3JjL2NvbXBvbmVudHMvTGlnaHRib3gvTGlnaHRib3gudHN4Iiwic291cmNlcyI6WyJzcmMvY29tcG9uZW50cy9MaWdodGJveC9MaWdodGJveC50c3giXSwic291cmNlc0NvbnRlbnQiOlsiLyogZXNsaW50LWRpc2FibGUgcmVhY3QvanN4LXByb3BzLW5vLXNwcmVhZGluZyAqL1xuaW1wb3J0IFJlYWN0LCB7XG4gIHVzZUNhbGxiYWNrLFxuICB1c2VSZWYsXG4gIHR5cGUgUHJvcHNXaXRoQ2hpbGRyZW4sXG4gIHR5cGUgUmVmT2JqZWN0LFxufSBmcm9tIFwicmVhY3RcIjtcbmltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsga2V5ZnJhbWVzIH0gZnJvbSBcIkBlbW90aW9uL3JlYWN0XCI7XG5pbXBvcnQgdHlwZSB7IExpZ2h0Ym94VmVydGljYWxBbGlnbm1lbnQsIE1RIH0gZnJvbSBcInNyYy90eXBlc1wiO1xuaW1wb3J0IHtcbiAgUG9ydGFsLFxuICB1c2VQb3J0YWxDb250YWluZXJFbGVtZW50LFxuICB0eXBlIFBvcnRhbFByb3BzLFxufSBmcm9tIFwiLi4vUG9ydGFsL1BvcnRhbFwiO1xuaW1wb3J0IHsgRm9jdXNUcmFwV3JhcHBlciB9IGZyb20gXCIuLi8uLi9zaGFyZWQvRm9jdXNUcmFwV3JhcHBlclwiO1xuaW1wb3J0IHsgdXNlUmVzcG9uc2l2ZVN0eWxlcyB9IGZyb20gXCIuLi8uLi9zaGFyZWQvbWVkaWFRdWVyaWVzXCI7XG5pbXBvcnQgeyBEaWFsb2dDb250ZXh0IH0gZnJvbSBcIi4uL1BhdHRlcm5zL0RpYWxvZy9EaWFsb2dDb250ZXh0XCI7XG5cbmV4cG9ydCB0eXBlIExpZ2h0Ym94UHJvcHMgPSBSZWFjdC5IVE1MQXR0cmlidXRlczxIVE1MRGl2RWxlbWVudD4gJiB7XG4gIGNoaWxkcmVuPzogUmVhY3QuUmVhY3ROb2RlW10gfCBSZWFjdC5SZWFjdE5vZGU7XG4gIGJhY2tkcm9wUmVmPzogUmVmT2JqZWN0PEhUTUxEaXZFbGVtZW50PjtcbiAgaGFuZGxlQ2xvc2U/OiAoKSA9PiB2b2lkO1xuICBpc0Rpc21pc3NpYmxlPzogYm9vbGVhbjtcbiAganVzdGlmeUNvbnRlbnQ/OiBNUTxMaWdodGJveFZlcnRpY2FsQWxpZ25tZW50PiB8IExpZ2h0Ym94VmVydGljYWxBbGlnbm1lbnQ7XG4gIHByaXZhdGVQcm9wcz86IHtcbiAgICBza2lwUG9ydGFsPzogYm9vbGVhbjtcbiAgICAvKipcbiAgICAgKiBAaW50ZXJuYWxcbiAgICAgKiBPcHRpb25zIHBhc3NlZCB0byBmb2N1cy10cmFwJ3MgdGFiYmFibGUgZGV0ZWN0aW9uLlxuICAgICAqIFVzZSBgeyBkaXNwbGF5Q2hlY2s6IFwibm9uZVwiIH1gIGZvciB0ZXN0aW5nIHRvIGF2b2lkIEpTRE9NIHZpc2liaWxpdHkgaXNzdWVzLlxuICAgICAqL1xuICAgIHRhYmJhYmxlT3B0aW9ucz86IHtcbiAgICAgIGRpc3BsYXlDaGVjaz86IFwiZnVsbFwiIHwgXCJsZWdhY3ktZnVsbFwiIHwgXCJub24temVyby1hcmVhXCIgfCBcIm5vbmVcIjtcbiAgICB9O1xuICB9O1xufSAmIFBpY2s8UG9ydGFsUHJvcHMsIFwicG9ydGFsQ29udGFpbmVyXCI+O1xuXG5leHBvcnQgY29uc3QgU3R5bGVkQmFja2Ryb3AgPSBzdHlsZWQuZGl2PFBpY2s8TGlnaHRib3hQcm9wcywgXCJqdXN0aWZ5Q29udGVudFwiPj4oXG4gICh7IHRoZW1lLCBqdXN0aWZ5Q29udGVudCB9KSA9PiB7XG4gICAgY29uc3QgZmFkZUluQmFja2Ryb3AgPSBrZXlmcmFtZXNgXG4gICAgZnJvbSB7XG4gICAgICBvcGFjaXR5OiAke3RoZW1lLnZhcmlhYmxlcy5vcGFjaXR5LmhpZGRlbn07XG4gICAgfVxuICAgIHRvIHtcbiAgICAgIG9wYWNpdHk6ICR7dGhlbWUudmFyaWFibGVzLm9wYWNpdHkudmlzaWJsZX07XG4gICAgfVxuICBgO1xuXG4gICAgcmV0dXJuIHtcbiAgICAgIHBvc2l0aW9uOiBcImZpeGVkXCIsXG4gICAgICB0b3A6IDAsXG4gICAgICBsZWZ0OiAwLFxuICAgICAgekluZGV4OiB0aGVtZS52YXJpYWJsZXMuekluZGV4Lm1vZGFsLFxuICAgICAgd2lkdGg6IFwiMTAwJVwiLFxuICAgICAgaGVpZ2h0OiBcIjEwMGR2aFwiLFxuICAgICAgYmFja2dyb3VuZDogdGhlbWUudmFsdWVzLmNvbG9yLmJhY2tncm91bmQuYmFja2Ryb3AuZGVmYXVsdCxcbiAgICAgIGRpc3BsYXk6IFwiZmxleFwiLFxuICAgICAgZmxleERpcmVjdGlvbjogXCJjb2x1bW5cIixcbiAgICAgIC4uLnVzZVJlc3BvbnNpdmVTdHlsZXMoe1xuICAgICAgICBqdXN0aWZ5Q29udGVudDogW1xuICAgICAgICAgIGp1c3RpZnlDb250ZW50LFxuICAgICAgICAgIHtcbiAgICAgICAgICAgIHRvcDogXCJmbGV4LXN0YXJ0XCIsXG4gICAgICAgICAgICBjZW50ZXI6IFwiY2VudGVyXCIsXG4gICAgICAgICAgfSxcbiAgICAgICAgXSxcbiAgICAgIH0pLFxuICAgICAgYWxpZ25JdGVtczogXCJjZW50ZXJcIixcbiAgICAgIGZsZXg6IFwiMSAwIGF1dG9cIixcbiAgICAgIGFuaW1hdGlvbjogYCR7ZmFkZUluQmFja2Ryb3B9ICR7dGhlbWUudmFyaWFibGVzLmFuaW1hdGlvbi5tb2RhbEJhY2tkcm9wLm9wZW4uZHVyYXRpb259ICR7dGhlbWUudmFyaWFibGVzLmFuaW1hdGlvbi5tb2RhbEJhY2tkcm9wLm9wZW4udGltaW5nRnVuY3Rpb259IGJvdGhgLFxuICAgIH07XG4gIH1cbik7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRDaGlsZHJlbldyYXBwZXIgPSBzdHlsZWQuZGl2KHtcbiAgZGlzcGxheTogXCJjb250ZW50c1wiLFxufSk7XG5cbmV4cG9ydCBmdW5jdGlvbiBMaWdodGJveCh7XG4gIGJhY2tkcm9wUmVmLFxuICBwb3J0YWxDb250YWluZXIsXG4gIGlzRGlzbWlzc2libGUgPSB0cnVlLFxuICBjaGlsZHJlbixcbiAgaGFuZGxlQ2xvc2UsXG4gIGp1c3RpZnlDb250ZW50ID0gXCJjZW50ZXJcIixcbiAgcHJpdmF0ZVByb3BzOiB7IHNraXBQb3J0YWwsIHRhYmJhYmxlT3B0aW9ucyB9ID0ge1xuICAgIHNraXBQb3J0YWw6IGZhbHNlLFxuICB9LFxufTogUHJvcHNXaXRoQ2hpbGRyZW48TGlnaHRib3hQcm9wcz4pOiBSZWFjdC5SZWFjdEVsZW1lbnQge1xuICBjb25zdCBwb3J0YWxDb250YWluZXJFbGVtZW50ID0gdXNlUG9ydGFsQ29udGFpbmVyRWxlbWVudChwb3J0YWxDb250YWluZXIpO1xuICBjb25zdCBtb2RhbFJlZiA9IHVzZVJlZihudWxsKTtcblxuICBjb25zdCBoYW5kbGVDbGlja091dHNpZGVEZWFjdGl2YXRlcyA9IHVzZUNhbGxiYWNrKFxuICAgIChldnQ6IE1vdXNlRXZlbnQgfCBUb3VjaEV2ZW50KSA9PiB7XG4gICAgICAvLyBEbyBub3QgY2xvc2Ugb24gY2xpY2sgdGhhdCBvY2N1cnMgb24gZWxlbWVudHMgd2l0aGluIHRoZSBzYW1lIHBvcnRhbCwgZm9yIGVnLCBkcm9wZG93biBhbmQgc2VsZWN0IG1lbnVzXG4gICAgICBpZiAoXG4gICAgICAgIHBvcnRhbENvbnRhaW5lckVsZW1lbnQuY29udGFpbnMoZXZ0LnRhcmdldCBhcyBIVE1MRWxlbWVudCkgJiZcbiAgICAgICAgZXZ0LnRhcmdldCAhPT0gYmFja2Ryb3BSZWY/LmN1cnJlbnRcbiAgICAgICkge1xuICAgICAgICByZXR1cm4gZmFsc2U7XG4gICAgICB9XG5cbiAgICAgIHJldHVybiBpc0Rpc21pc3NpYmxlO1xuICAgIH0sXG4gICAgW2JhY2tkcm9wUmVmLCBwb3J0YWxDb250YWluZXJFbGVtZW50LCBpc0Rpc21pc3NpYmxlXVxuICApO1xuXG4gIGNvbnN0IGdldEZvY3VzVGFyZ2V0ID0gKCkgPT4ge1xuICAgIGNvbnN0IGNvbnRhaW5lciA9IG1vZGFsUmVmPy5jdXJyZW50XG4gICAgICA/LmZpcnN0RWxlbWVudENoaWxkIGFzIEhUTUxFbGVtZW50IHwgbnVsbDtcblxuICAgIGNvbnN0IGZvY3VzYWJsZVNlbGVjdG9yID1cbiAgICAgICdhW2hyZWZdLCBidXR0b246bm90KFtkaXNhYmxlZF0pLCBpbnB1dDpub3QoW2Rpc2FibGVkXSksIHNlbGVjdDpub3QoW2Rpc2FibGVkXSksIHRleHRhcmVhOm5vdChbZGlzYWJsZWRdKSwgW3RhYmluZGV4XTpub3QoW3RhYmluZGV4PVwiLTFcIl0pJztcbiAgICBjb25zdCBmaXJzdEZvY3VzYWJsZSA9XG4gICAgICBjb250YWluZXI/LnF1ZXJ5U2VsZWN0b3I8SFRNTEVsZW1lbnQ+KGZvY3VzYWJsZVNlbGVjdG9yKTtcbiAgICBpZiAoZmlyc3RGb2N1c2FibGUpIHtcbiAgICAgIHJldHVybiBmaXJzdEZvY3VzYWJsZTtcbiAgICB9XG5cbiAgICByZXR1cm4gY29udGFpbmVyIHx8IGRvY3VtZW50LmJvZHk7XG4gIH07XG5cbiAgY29uc3QgY29udGVudCA9IChcbiAgICA8U3R5bGVkQmFja2Ryb3BcbiAgICAgIHJlZj17YmFja2Ryb3BSZWZ9XG4gICAgICBqdXN0aWZ5Q29udGVudD17anVzdGlmeUNvbnRlbnR9XG4gICAgICBkYXRhLWRzLWlkPVwiTGlnaHRib3hcIlxuICAgID5cbiAgICAgIDxGb2N1c1RyYXBXcmFwcGVyXG4gICAgICAgIGFjdGl2ZVxuICAgICAgICBmb2N1c1RyYXBPcHRpb25zPXt7XG4gICAgICAgICAgYWxsb3dPdXRzaWRlQ2xpY2s6IHRydWUsIC8vIGFsbG93IGNsaWNrIG9uIG1vYmlsZSBpbiBhbnkgZHJvcGRvd25zXG4gICAgICAgICAgY2xpY2tPdXRzaWRlRGVhY3RpdmF0ZXM6IGhhbmRsZUNsaWNrT3V0c2lkZURlYWN0aXZhdGVzLFxuICAgICAgICAgIGVzY2FwZURlYWN0aXZhdGVzOiBpc0Rpc21pc3NpYmxlLCAvLyBkZS1hY3RpdmF0ZSBmb2N1cyB0cmFwIG9uIGVzY2FwZSBrZXlcbiAgICAgICAgICBwcmV2ZW50U2Nyb2xsOiB0cnVlLFxuICAgICAgICAgIGluaXRpYWxGb2N1czogKCkgPT4gZ2V0Rm9jdXNUYXJnZXQoKSxcbiAgICAgICAgICBmYWxsYmFja0ZvY3VzOiAoKSA9PiBnZXRGb2N1c1RhcmdldCgpLFxuICAgICAgICAgIC4uLih0YWJiYWJsZU9wdGlvbnMgJiYgeyB0YWJiYWJsZU9wdGlvbnMgfSksXG4gICAgICAgICAgLi4uKGhhbmRsZUNsb3NlICYmIHsgb25Qb3N0RGVhY3RpdmF0ZTogaGFuZGxlQ2xvc2UgfSksXG4gICAgICAgIH19XG4gICAgICA+XG4gICAgICAgIDxTdHlsZWRDaGlsZHJlbldyYXBwZXIgcmVmPXttb2RhbFJlZn0+XG4gICAgICAgICAgPERpYWxvZ0NvbnRleHQuUHJvdmlkZXIgdmFsdWU+e2NoaWxkcmVufTwvRGlhbG9nQ29udGV4dC5Qcm92aWRlcj5cbiAgICAgICAgPC9TdHlsZWRDaGlsZHJlbldyYXBwZXI+XG4gICAgICA8L0ZvY3VzVHJhcFdyYXBwZXI+XG4gICAgPC9TdHlsZWRCYWNrZHJvcD5cbiAgKTtcblxuICAvLyBGb3IgdGVzdGluZyBhbmQgTW9kYWwgc3Rvcnkgd2UgZG9uJ3Qgd2FudCB0byByZW5kZXIgdGhlIGNvbnRlbnQgaW5zaWRlIGEgcG9ydGFsXG4gIGlmIChza2lwUG9ydGFsKSB7XG4gICAgcmV0dXJuIGNvbnRlbnQ7XG4gIH1cblxuICByZXR1cm4gPFBvcnRhbCBwb3J0YWxDb250YWluZXI9e3BvcnRhbENvbnRhaW5lcn0+e2NvbnRlbnR9PC9Qb3J0YWw+O1xufVxuIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXNDOEIifQ== */");export const StyledChildrenWrapper=styled("div",{target:"e79ud7r1",label:"StyledChildrenWrapper"})({display:"contents"},"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3JjL2NvbXBvbmVudHMvTGlnaHRib3gvTGlnaHRib3gudHN4Iiwic291cmNlcyI6WyJzcmMvY29tcG9uZW50cy9MaWdodGJveC9MaWdodGJveC50c3giXSwic291cmNlc0NvbnRlbnQiOlsiLyogZXNsaW50LWRpc2FibGUgcmVhY3QvanN4LXByb3BzLW5vLXNwcmVhZGluZyAqL1xuaW1wb3J0IFJlYWN0LCB7XG4gIHVzZUNhbGxiYWNrLFxuICB1c2VSZWYsXG4gIHR5cGUgUHJvcHNXaXRoQ2hpbGRyZW4sXG4gIHR5cGUgUmVmT2JqZWN0LFxufSBmcm9tIFwicmVhY3RcIjtcbmltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsga2V5ZnJhbWVzIH0gZnJvbSBcIkBlbW90aW9uL3JlYWN0XCI7XG5pbXBvcnQgdHlwZSB7IExpZ2h0Ym94VmVydGljYWxBbGlnbm1lbnQsIE1RIH0gZnJvbSBcInNyYy90eXBlc1wiO1xuaW1wb3J0IHtcbiAgUG9ydGFsLFxuICB1c2VQb3J0YWxDb250YWluZXJFbGVtZW50LFxuICB0eXBlIFBvcnRhbFByb3BzLFxufSBmcm9tIFwiLi4vUG9ydGFsL1BvcnRhbFwiO1xuaW1wb3J0IHsgRm9jdXNUcmFwV3JhcHBlciB9IGZyb20gXCIuLi8uLi9zaGFyZWQvRm9jdXNUcmFwV3JhcHBlclwiO1xuaW1wb3J0IHsgdXNlUmVzcG9uc2l2ZVN0eWxlcyB9IGZyb20gXCIuLi8uLi9zaGFyZWQvbWVkaWFRdWVyaWVzXCI7XG5pbXBvcnQgeyBEaWFsb2dDb250ZXh0IH0gZnJvbSBcIi4uL1BhdHRlcm5zL0RpYWxvZy9EaWFsb2dDb250ZXh0XCI7XG5cbmV4cG9ydCB0eXBlIExpZ2h0Ym94UHJvcHMgPSBSZWFjdC5IVE1MQXR0cmlidXRlczxIVE1MRGl2RWxlbWVudD4gJiB7XG4gIGNoaWxkcmVuPzogUmVhY3QuUmVhY3ROb2RlW10gfCBSZWFjdC5SZWFjdE5vZGU7XG4gIGJhY2tkcm9wUmVmPzogUmVmT2JqZWN0PEhUTUxEaXZFbGVtZW50PjtcbiAgaGFuZGxlQ2xvc2U/OiAoKSA9PiB2b2lkO1xuICBpc0Rpc21pc3NpYmxlPzogYm9vbGVhbjtcbiAganVzdGlmeUNvbnRlbnQ/OiBNUTxMaWdodGJveFZlcnRpY2FsQWxpZ25tZW50PiB8IExpZ2h0Ym94VmVydGljYWxBbGlnbm1lbnQ7XG4gIHByaXZhdGVQcm9wcz86IHtcbiAgICBza2lwUG9ydGFsPzogYm9vbGVhbjtcbiAgICAvKipcbiAgICAgKiBAaW50ZXJuYWxcbiAgICAgKiBPcHRpb25zIHBhc3NlZCB0byBmb2N1cy10cmFwJ3MgdGFiYmFibGUgZGV0ZWN0aW9uLlxuICAgICAqIFVzZSBgeyBkaXNwbGF5Q2hlY2s6IFwibm9uZVwiIH1gIGZvciB0ZXN0aW5nIHRvIGF2b2lkIEpTRE9NIHZpc2liaWxpdHkgaXNzdWVzLlxuICAgICAqL1xuICAgIHRhYmJhYmxlT3B0aW9ucz86IHtcbiAgICAgIGRpc3BsYXlDaGVjaz86IFwiZnVsbFwiIHwgXCJsZWdhY3ktZnVsbFwiIHwgXCJub24temVyby1hcmVhXCIgfCBcIm5vbmVcIjtcbiAgICB9O1xuICB9O1xufSAmIFBpY2s8UG9ydGFsUHJvcHMsIFwicG9ydGFsQ29udGFpbmVyXCI+O1xuXG5leHBvcnQgY29uc3QgU3R5bGVkQmFja2Ryb3AgPSBzdHlsZWQuZGl2PFBpY2s8TGlnaHRib3hQcm9wcywgXCJqdXN0aWZ5Q29udGVudFwiPj4oXG4gICh7IHRoZW1lLCBqdXN0aWZ5Q29udGVudCB9KSA9PiB7XG4gICAgY29uc3QgZmFkZUluQmFja2Ryb3AgPSBrZXlmcmFtZXNgXG4gICAgZnJvbSB7XG4gICAgICBvcGFjaXR5OiAke3RoZW1lLnZhcmlhYmxlcy5vcGFjaXR5LmhpZGRlbn07XG4gICAgfVxuICAgIHRvIHtcbiAgICAgIG9wYWNpdHk6ICR7dGhlbWUudmFyaWFibGVzLm9wYWNpdHkudmlzaWJsZX07XG4gICAgfVxuICBgO1xuXG4gICAgcmV0dXJuIHtcbiAgICAgIHBvc2l0aW9uOiBcImZpeGVkXCIsXG4gICAgICB0b3A6IDAsXG4gICAgICBsZWZ0OiAwLFxuICAgICAgekluZGV4OiB0aGVtZS52YXJpYWJsZXMuekluZGV4Lm1vZGFsLFxuICAgICAgd2lkdGg6IFwiMTAwJVwiLFxuICAgICAgaGVpZ2h0OiBcIjEwMGR2aFwiLFxuICAgICAgYmFja2dyb3VuZDogdGhlbWUudmFsdWVzLmNvbG9yLmJhY2tncm91bmQuYmFja2Ryb3AuZGVmYXVsdCxcbiAgICAgIGRpc3BsYXk6IFwiZmxleFwiLFxuICAgICAgZmxleERpcmVjdGlvbjogXCJjb2x1bW5cIixcbiAgICAgIC4uLnVzZVJlc3BvbnNpdmVTdHlsZXMoe1xuICAgICAgICBqdXN0aWZ5Q29udGVudDogW1xuICAgICAgICAgIGp1c3RpZnlDb250ZW50LFxuICAgICAgICAgIHtcbiAgICAgICAgICAgIHRvcDogXCJmbGV4LXN0YXJ0XCIsXG4gICAgICAgICAgICBjZW50ZXI6IFwiY2VudGVyXCIsXG4gICAgICAgICAgfSxcbiAgICAgICAgXSxcbiAgICAgIH0pLFxuICAgICAgYWxpZ25JdGVtczogXCJjZW50ZXJcIixcbiAgICAgIGZsZXg6IFwiMSAwIGF1dG9cIixcbiAgICAgIGFuaW1hdGlvbjogYCR7ZmFkZUluQmFja2Ryb3B9ICR7dGhlbWUudmFyaWFibGVzLmFuaW1hdGlvbi5tb2RhbEJhY2tkcm9wLm9wZW4uZHVyYXRpb259ICR7dGhlbWUudmFyaWFibGVzLmFuaW1hdGlvbi5tb2RhbEJhY2tkcm9wLm9wZW4udGltaW5nRnVuY3Rpb259IGJvdGhgLFxuICAgIH07XG4gIH1cbik7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRDaGlsZHJlbldyYXBwZXIgPSBzdHlsZWQuZGl2KHtcbiAgZGlzcGxheTogXCJjb250ZW50c1wiLFxufSk7XG5cbmV4cG9ydCBmdW5jdGlvbiBMaWdodGJveCh7XG4gIGJhY2tkcm9wUmVmLFxuICBwb3J0YWxDb250YWluZXIsXG4gIGlzRGlzbWlzc2libGUgPSB0cnVlLFxuICBjaGlsZHJlbixcbiAgaGFuZGxlQ2xvc2UsXG4gIGp1c3RpZnlDb250ZW50ID0gXCJjZW50ZXJcIixcbiAgcHJpdmF0ZVByb3BzOiB7IHNraXBQb3J0YWwsIHRhYmJhYmxlT3B0aW9ucyB9ID0ge1xuICAgIHNraXBQb3J0YWw6IGZhbHNlLFxuICB9LFxufTogUHJvcHNXaXRoQ2hpbGRyZW48TGlnaHRib3hQcm9wcz4pOiBSZWFjdC5SZWFjdEVsZW1lbnQge1xuICBjb25zdCBwb3J0YWxDb250YWluZXJFbGVtZW50ID0gdXNlUG9ydGFsQ29udGFpbmVyRWxlbWVudChwb3J0YWxDb250YWluZXIpO1xuICBjb25zdCBtb2RhbFJlZiA9IHVzZVJlZihudWxsKTtcblxuICBjb25zdCBoYW5kbGVDbGlja091dHNpZGVEZWFjdGl2YXRlcyA9IHVzZUNhbGxiYWNrKFxuICAgIChldnQ6IE1vdXNlRXZlbnQgfCBUb3VjaEV2ZW50KSA9PiB7XG4gICAgICAvLyBEbyBub3QgY2xvc2Ugb24gY2xpY2sgdGhhdCBvY2N1cnMgb24gZWxlbWVudHMgd2l0aGluIHRoZSBzYW1lIHBvcnRhbCwgZm9yIGVnLCBkcm9wZG93biBhbmQgc2VsZWN0IG1lbnVzXG4gICAgICBpZiAoXG4gICAgICAgIHBvcnRhbENvbnRhaW5lckVsZW1lbnQuY29udGFpbnMoZXZ0LnRhcmdldCBhcyBIVE1MRWxlbWVudCkgJiZcbiAgICAgICAgZXZ0LnRhcmdldCAhPT0gYmFja2Ryb3BSZWY/LmN1cnJlbnRcbiAgICAgICkge1xuICAgICAgICByZXR1cm4gZmFsc2U7XG4gICAgICB9XG5cbiAgICAgIHJldHVybiBpc0Rpc21pc3NpYmxlO1xuICAgIH0sXG4gICAgW2JhY2tkcm9wUmVmLCBwb3J0YWxDb250YWluZXJFbGVtZW50LCBpc0Rpc21pc3NpYmxlXVxuICApO1xuXG4gIGNvbnN0IGdldEZvY3VzVGFyZ2V0ID0gKCkgPT4ge1xuICAgIGNvbnN0IGNvbnRhaW5lciA9IG1vZGFsUmVmPy5jdXJyZW50XG4gICAgICA/LmZpcnN0RWxlbWVudENoaWxkIGFzIEhUTUxFbGVtZW50IHwgbnVsbDtcblxuICAgIGNvbnN0IGZvY3VzYWJsZVNlbGVjdG9yID1cbiAgICAgICdhW2hyZWZdLCBidXR0b246bm90KFtkaXNhYmxlZF0pLCBpbnB1dDpub3QoW2Rpc2FibGVkXSksIHNlbGVjdDpub3QoW2Rpc2FibGVkXSksIHRleHRhcmVhOm5vdChbZGlzYWJsZWRdKSwgW3RhYmluZGV4XTpub3QoW3RhYmluZGV4PVwiLTFcIl0pJztcbiAgICBjb25zdCBmaXJzdEZvY3VzYWJsZSA9XG4gICAgICBjb250YWluZXI/LnF1ZXJ5U2VsZWN0b3I8SFRNTEVsZW1lbnQ+KGZvY3VzYWJsZVNlbGVjdG9yKTtcbiAgICBpZiAoZmlyc3RGb2N1c2FibGUpIHtcbiAgICAgIHJldHVybiBmaXJzdEZvY3VzYWJsZTtcbiAgICB9XG5cbiAgICByZXR1cm4gY29udGFpbmVyIHx8IGRvY3VtZW50LmJvZHk7XG4gIH07XG5cbiAgY29uc3QgY29udGVudCA9IChcbiAgICA8U3R5bGVkQmFja2Ryb3BcbiAgICAgIHJlZj17YmFja2Ryb3BSZWZ9XG4gICAgICBqdXN0aWZ5Q29udGVudD17anVzdGlmeUNvbnRlbnR9XG4gICAgICBkYXRhLWRzLWlkPVwiTGlnaHRib3hcIlxuICAgID5cbiAgICAgIDxGb2N1c1RyYXBXcmFwcGVyXG4gICAgICAgIGFjdGl2ZVxuICAgICAgICBmb2N1c1RyYXBPcHRpb25zPXt7XG4gICAgICAgICAgYWxsb3dPdXRzaWRlQ2xpY2s6IHRydWUsIC8vIGFsbG93IGNsaWNrIG9uIG1vYmlsZSBpbiBhbnkgZHJvcGRvd25zXG4gICAgICAgICAgY2xpY2tPdXRzaWRlRGVhY3RpdmF0ZXM6IGhhbmRsZUNsaWNrT3V0c2lkZURlYWN0aXZhdGVzLFxuICAgICAgICAgIGVzY2FwZURlYWN0aXZhdGVzOiBpc0Rpc21pc3NpYmxlLCAvLyBkZS1hY3RpdmF0ZSBmb2N1cyB0cmFwIG9uIGVzY2FwZSBrZXlcbiAgICAgICAgICBwcmV2ZW50U2Nyb2xsOiB0cnVlLFxuICAgICAgICAgIGluaXRpYWxGb2N1czogKCkgPT4gZ2V0Rm9jdXNUYXJnZXQoKSxcbiAgICAgICAgICBmYWxsYmFja0ZvY3VzOiAoKSA9PiBnZXRGb2N1c1RhcmdldCgpLFxuICAgICAgICAgIC4uLih0YWJiYWJsZU9wdGlvbnMgJiYgeyB0YWJiYWJsZU9wdGlvbnMgfSksXG4gICAgICAgICAgLi4uKGhhbmRsZUNsb3NlICYmIHsgb25Qb3N0RGVhY3RpdmF0ZTogaGFuZGxlQ2xvc2UgfSksXG4gICAgICAgIH19XG4gICAgICA+XG4gICAgICAgIDxTdHlsZWRDaGlsZHJlbldyYXBwZXIgcmVmPXttb2RhbFJlZn0+XG4gICAgICAgICAgPERpYWxvZ0NvbnRleHQuUHJvdmlkZXIgdmFsdWU+e2NoaWxkcmVufTwvRGlhbG9nQ29udGV4dC5Qcm92aWRlcj5cbiAgICAgICAgPC9TdHlsZWRDaGlsZHJlbldyYXBwZXI+XG4gICAgICA8L0ZvY3VzVHJhcFdyYXBwZXI+XG4gICAgPC9TdHlsZWRCYWNrZHJvcD5cbiAgKTtcblxuICAvLyBGb3IgdGVzdGluZyBhbmQgTW9kYWwgc3Rvcnkgd2UgZG9uJ3Qgd2FudCB0byByZW5kZXIgdGhlIGNvbnRlbnQgaW5zaWRlIGEgcG9ydGFsXG4gIGlmIChza2lwUG9ydGFsKSB7XG4gICAgcmV0dXJuIGNvbnRlbnQ7XG4gIH1cblxuICByZXR1cm4gPFBvcnRhbCBwb3J0YWxDb250YWluZXI9e3BvcnRhbENvbnRhaW5lcn0+e2NvbnRlbnR9PC9Qb3J0YWw+O1xufVxuIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQTJFcUMifQ== */");export function Lightbox({backdropRef,portalContainer,isDismissible=!0,children,handleClose,justifyContent="center",privateProps:{skipPortal,tabbableOptions}={skipPortal:!1}}){let portalContainerElement=usePortalContainerElement(portalContainer),modalRef=useRef(null),handleClickOutsideDeactivates=useCallback(evt=>(!portalContainerElement.contains(evt.target)||evt.target===backdropRef?.current)&&isDismissible,[backdropRef,portalContainerElement,isDismissible]),getFocusTarget=()=>{let container=modalRef?.current?.firstElementChild,firstFocusable=container?.querySelector('a[href], button:not([disabled]), input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex="-1"])');return firstFocusable||container||document.body},content=React.createElement(StyledBackdrop,{ref:backdropRef,justifyContent:justifyContent,"data-ds-id":"Lightbox"},React.createElement(FocusTrapWrapper,{active:!0,focusTrapOptions:{allowOutsideClick:!0,clickOutsideDeactivates:handleClickOutsideDeactivates,escapeDeactivates:isDismissible,preventScroll:!0,initialFocus:()=>getFocusTarget(),fallbackFocus:()=>getFocusTarget(),...tabbableOptions&&{tabbableOptions},...handleClose&&{onPostDeactivate:handleClose}}},React.createElement(StyledChildrenWrapper,{ref:modalRef},React.createElement(DialogContext.Provider,{value:!0},children))));return skipPortal?content:React.createElement(Portal,{portalContainer:portalContainer},content)}

package/build/esm/components/Patterns/Modal/Modal.d.ts

@@ -6,7 +6,6 @@ import type { StackProps } from "../../Stack/Stack";
 import type { ButtonGroupButtonProps } from "../ButtonGroup/ButtonGroup";
 import type { TextProps } from "../../Typography/Text/Text";
 type BaseProps = {
-    header?: string;
     onAction?: (action: "cancel" | "action") => void;
     role?: "dialog" | "alertdialog";
     labelHeader?: string;
@@ -51,7 +50,21 @@ type BaseProps = {
     isMaxWidthLimit?: boolean;
     size?: "m" | "l";
     closeButtonAriaLabel?: string;
-} & AriaAttributes;
+} & Omit<AriaAttributes, "aria-label" | "aria-labelledby">;
+/** At least one of header, aria-label, or aria-labelledby must be provided for accessibility */
+type LabelProps = {
+    header: string;
+    "aria-label"?: string;
+    "aria-labelledby"?: string;
+} | {
+    header?: string;
+    "aria-label": string;
+    "aria-labelledby"?: string;
+} | {
+    header?: string;
+    "aria-label"?: string;
+    "aria-labelledby": string;
+};
 type ConditionalProps = {
     /** Aspect ratio 16:9 */
     imageUrl?: string;
@@ -63,7 +76,7 @@ type ConditionalProps = {
     /** Accept ratio 16:9 */
     ImageComponent?: React.ElementType<any>;
 };
-export type ModalProps = BaseProps & ConditionalProps & Pick<PortalProps, "portalContainer">;
+export type ModalProps = BaseProps & LabelProps & ConditionalProps & Pick<PortalProps, "portalContainer">;
 export declare function Modal({ header, subHeader, labelHeader, children, imageUrl, ImageComponent, secondaryButton, cancelButtonLabel, isDismissible, isFullScreen, isMaxWidthLimit, actionButton, role, onAction, size, privateProps: { skipPortal, height, zeroPadding, tabbableOptions }, portalContainer, closeButtonAriaLabel, "data-e2e-test-id": dataE2eTestId, imageAlt, ...ariaAttributes }: ModalProps): React.ReactElement;
 export declare namespace Modal {
     var Stack: ({ children, ...rest }: Omit<StackProps, "space">) => React.JSX.Element;