@amboss/design-system 4.8.2-canary.0 → 4.9.0

package/build/cjs/components/Form/Radio/Radio.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var target=exports,all={get Radio(){return Radio},get RadioRaw(){return RadioRaw},get StyledRadioContainer(){return StyledRadioContainer}};for(var name in all)Object.defineProperty(target,name,{enumerable:!0,get:Object.getOwnPropertyDescriptor(all,name).get});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/_interop_require_default._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_FormField=require("../FormField/FormField"),_Inline=require("../../Inline/Inline"),_Text=require("../../Typography/Text/Text"),_useFormFieldMessageId=require("../FormField/useFormFieldMessageId"),StyledInputContainer=(0,_styled.default)("div",{target:"e1jwbonf0",label:"StyledInputContainer"})(({theme,vSize,hSize})=>({userSelect:"none",display:"flex",position:"relative",width:theme.variables.size.dimension.radio[hSize],height:`calc(${theme.variables.size.font[vSize]} * ${(0,_Text.getTextLineHeight)({size:vSize,theme})})`,boxSizing:"border-box",alignItems:"center"})),StyledRealInput=(0,_styled.default)("input",{target:"e1jwbonf1",label:"StyledRealInput"})(({theme})=>({opacity:theme.variables.opacity.hidden,cursor:"pointer",position:"absolute",width:0,height:0})),StyledFakeInput=(0,_styled.default)("span",{target:"e1jwbonf2",label:"StyledFakeInput"})(({theme,size})=>({boxSizing:"border-box",width:theme.variables.size.dimension.radio[size],height:theme.variables.size.dimension.radio[size],borderRadius:theme.variables.size.borderRadius.m,border:"2px solid",top:"50%",left:0,transform:"translate(0, -50%)",display:"flex",alignItems:"center",justifyContent:"center",position:"absolute",background:theme.values.color.background.primary.default,borderColor:theme.values.color.border.primary.default,"& div":{opacity:theme.variables.opacity.hidden,borderRadius:theme.variables.size.borderRadius.full,width:theme.variables.size.dimension.radioPoint[size],height:theme.variables.size.dimension.radioPoint[size],background:theme.values.color.border.accent.default},"input:checked + &":{borderColor:theme.values.color.border.accent.default,background:theme.values.color.background.primary.default,"& div":{opacity:theme.variables.opacity.visible}},"input:focus-visible + &":{outlineWidth:"2px",outlineStyle:"solid",outlineColor:"Highlight"},"@media (-webkit-min-device-pixel-ratio:0)":{"input:focus-visible + &":{outlineColor:"-webkit-focus-ring-color",outlineStyle:"auto"}},"input:disabled + &":{pointerEvents:"none"}})),StyledRadioContainer=(0,_styled.default)("div",{target:"e1jwbonf3",label:"StyledRadioContainer"})(({theme,isInteractable})=>({"&:hover":{...isInteractable&&{cursor:"pointer",[`input:not(:checked) + ${StyledFakeInput}`]:{borderColor:theme.values.color.border.primary.hover}},...!isInteractable&&{cursor:"not-allowed"}}})),RadioRaw=_react.default.forwardRef(({label="",labelHint,size="m",labelSize="m",disabled,...rest},ref)=>_react.default.createElement(StyledRadioContainer,{isInteractable:!disabled},_react.default.createElement(_Inline.Inline,{space:"xs",vAlignItems:"top",noWrap:!0},_react.default.createElement(StyledInputContainer,{vSize:labelSize,hSize:size},_react.default.createElement(StyledRealInput,{...rest,disabled:disabled,ref:ref,type:"radio"}),_react.default.createElement(StyledFakeInput,{size:size},_react.default.createElement("div",null))),label&&_react.default.createElement("div",null,"string"==typeof label?_react.default.createElement(_Text.Text,{size:labelSize},label):label,labelHint&&_react.default.createElement(_Text.Text,{size:"s",color:"tertiary"},labelHint))))),Radio=_react.default.forwardRef(({label="",labelHint,disabled=!1,size="m",hint,errorMessages,"data-e2e-test-id":dataE2eTestId,"aria-describedby":ariaDescribedBy,...rest},ref)=>{let{id,ariaDescribedByProp}=(0,_useFormFieldMessageId.useFormFieldMessageId)({ariaDescribedBy,errorMessages,hint});return _react.default.createElement(_FormField.FormField,{"data-e2e-test-id":dataE2eTestId,"data-ds-id":"Radio",disabled:disabled,hint:hint,errorMessages:errorMessages,messageId:id},_react.default.createElement(RadioRaw,{...rest,ref:ref,size:size,label:label,labelHint:labelHint,disabled:disabled,...ariaDescribedByProp}))});
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var target=exports,all={get Radio(){return Radio},get RadioRaw(){return RadioRaw},get StyledRadioContainer(){return StyledRadioContainer}};for(var name in all)Object.defineProperty(target,name,{enumerable:!0,get:Object.getOwnPropertyDescriptor(all,name).get});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/_interop_require_default._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_FormField=require("../FormField/FormField"),_Inline=require("../../Inline/Inline"),_Text=require("../../Typography/Text/Text"),_useFormFieldMessageId=require("../FormField/useFormFieldMessageId"),StyledInputContainer=(0,_styled.default)("div",{target:"eb3g3qo0",label:"StyledInputContainer"})(({theme,vSize,hSize})=>({userSelect:"none",display:"flex",position:"relative",width:theme.variables.size.dimension.radio[hSize],height:`calc(${theme.variables.size.font[vSize]} * ${(0,_Text.getTextLineHeight)({size:vSize,theme})})`,boxSizing:"border-box",alignItems:"center"})),StyledRealInput=(0,_styled.default)("input",{target:"eb3g3qo1",label:"StyledRealInput"})(({theme})=>({opacity:theme.variables.opacity.hidden,cursor:"pointer",position:"absolute",width:0,height:0})),StyledFakeInput=(0,_styled.default)("span",{target:"eb3g3qo2",label:"StyledFakeInput"})(({theme,size})=>({boxSizing:"border-box",width:theme.variables.size.dimension.radio[size],height:theme.variables.size.dimension.radio[size],borderRadius:theme.variables.size.borderRadius.m,border:"2px solid",top:"50%",left:0,transform:"translate(0, -50%)",display:"flex",alignItems:"center",justifyContent:"center",position:"absolute",background:theme.values.color.background.primary.default,borderColor:theme.values.color.border.primary.default,"& div":{opacity:theme.variables.opacity.hidden,borderRadius:theme.variables.size.borderRadius.full,width:theme.variables.size.dimension.radioPoint[size],height:theme.variables.size.dimension.radioPoint[size],background:theme.values.color.border.accent.default},"input:checked + &":{borderColor:theme.values.color.border.accent.default,background:theme.values.color.background.primary.default,"& div":{opacity:theme.variables.opacity.visible}},"input:focus-visible + &":{outlineWidth:"2px",outlineStyle:"solid",outlineColor:"Highlight"},"@media (-webkit-min-device-pixel-ratio:0)":{"input:focus-visible + &":{outlineColor:"-webkit-focus-ring-color",outlineStyle:"auto"}},"input:disabled + &":{pointerEvents:"none"}})),StyledRadioContainer=(0,_styled.default)("div",{target:"eb3g3qo3",label:"StyledRadioContainer"})(({theme,isInteractable})=>({"&:hover":{...isInteractable&&{cursor:"pointer",[`input:not(:checked) + ${StyledFakeInput}`]:{borderColor:theme.values.color.border.primary.hover}},...!isInteractable&&{cursor:"not-allowed"}}})),RadioRaw=_react.default.forwardRef(({label="",labelHint,size="m",labelSize="m",disabled,...rest},ref)=>_react.default.createElement(StyledRadioContainer,{isInteractable:!disabled},_react.default.createElement(_Inline.Inline,{space:"xs",vAlignItems:"top",noWrap:!0},_react.default.createElement(StyledInputContainer,{vSize:labelSize,hSize:size},_react.default.createElement(StyledRealInput,{...rest,disabled:disabled,ref:ref,type:"radio"}),_react.default.createElement(StyledFakeInput,{size:size},_react.default.createElement("div",null))),label&&_react.default.createElement("div",null,"string"==typeof label?_react.default.createElement(_Text.Text,{size:labelSize},label):label,labelHint&&_react.default.createElement(_Text.Text,{size:"s",color:"tertiary"},labelHint))))),Radio=_react.default.forwardRef(({label="",labelHint,disabled=!1,size="m",hint,errorMessages,"data-e2e-test-id":dataE2eTestId,"aria-describedby":ariaDescribedBy,...rest},ref)=>{let{id,ariaDescribedByProp}=(0,_useFormFieldMessageId.useFormFieldMessageId)({ariaDescribedBy,errorMessages,hint});return _react.default.createElement(_FormField.FormField,{"data-e2e-test-id":dataE2eTestId,"data-ds-id":"Radio",disabled:disabled,hint:hint,errorMessages:errorMessages,messageId:id},_react.default.createElement(RadioRaw,{...rest,ref:ref,size:size,label:label,labelHint:labelHint,disabled:disabled,...ariaDescribedByProp}))});

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

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"RangeInput",{enumerable:!0,get:function(){return RangeInput}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/require("@swc/helpers/_/_interop_require_wildcard")._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_react1=require("@emotion/react"),_FormField=require("../FormField/FormField"),_useFormFieldMessageId=require("../FormField/useFormFieldMessageId"),StyledInput=(0,_styled.default)("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}}),RangeInput=_react.default.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=(0,_react1.useTheme)(),{id,ariaDescribedByProp}=(0,_useFormFieldMessageId.useFormFieldMessageId)({ariaDescribedBy,errorMessages,hint}),background=(0,_react.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=(0,_react.useCallback)(e=>{onSlideStart&&onSlideStart(e)},[onSlideStart]);return _react.default.createElement(_FormField.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.default.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}))});
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"RangeInput",{enumerable:!0,get:function(){return RangeInput}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/require("@swc/helpers/_/_interop_require_wildcard")._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_react1=require("@emotion/react"),_FormField=require("../FormField/FormField"),_useFormFieldMessageId=require("../FormField/useFormFieldMessageId"),StyledInput=(0,_styled.default)("input",{target:"e1vc6tql0",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}}),RangeInput=_react.default.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=(0,_react1.useTheme)(),{id,ariaDescribedByProp}=(0,_useFormFieldMessageId.useFormFieldMessageId)({ariaDescribedBy,errorMessages,hint}),background=(0,_react.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=(0,_react.useCallback)(e=>{onSlideStart&&onSlideStart(e)},[onSlideStart]);return _react.default.createElement(_FormField.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.default.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/cjs/components/Form/SearchInput/SearchInput.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"SearchInput",{enumerable:!0,get:function(){return SearchInput}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/require("@swc/helpers/_/_interop_require_wildcard")._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_icon_sizes_mapjson=/*#__PURE__*/_interop_require_default._(require("../../../web-tokens/_icon_sizes_map.json")),_Icon=require("../../Icon/Icon"),_PictogramButton=require("../../PictogramButton/PictogramButton"),_Input=require("../Input/Input"),_FormField=require("../FormField/FormField"),_useFormFieldMessageId=require("../FormField/useFormFieldMessageId"),iconSizes=_icon_sizes_mapjson.default.icons,StyledSearchInputContainer=(0,_styled.default)("div",{target:"elipqdd0",label:"StyledSearchInputContainer"})(({theme})=>({position:"relative",backgroundColor:theme.values.color.searchInput.background.default,borderRadius:theme.variables.size.borderRadius.xs,height:theme.variables.size.spacing.xl,width:"100%","& input":{backgroundColor:theme.values.color.background.transparent.default,paddingTop:theme.variables.size.spacing.xxs,paddingBottom:theme.variables.size.spacing.xxs,paddingLeft:`calc(${theme.variables.size.spacing.s} + ${iconSizes.s})`,paddingRight:theme.variables.size.spacing.xl,borderWidth:0,textOverflow:"ellipsis","&::placeholder":{color:theme.values.color.text.tertiary.default,fontStyle:"italic"}}})),IconsContainer=(0,_styled.default)("div",{target:"elipqdd1",label:"IconsContainer"})(({theme})=>({display:"flex",alignItems:"center",justifyContent:"space-between",position:"absolute",inset:`0 ${theme.variables.size.spacing.xs}`,"& > div":{lineHeight:0}})),SearchInput=({value,placeholder,autoComplete="on",readOnly,label,labelHint,hideLabel=!0,hint,errorMessages,"aria-describedby":ariaDescribedBy,"data-e2e-test-id":dataE2eTestId,onClear=()=>null,slotProps,...rest})=>{let inputRef=(0,_react.useRef)(null),{id,ariaDescribedByProp}=(0,_useFormFieldMessageId.useFormFieldMessageId)({ariaDescribedBy,errorMessages,hint});return _react.default.createElement(_FormField.FormField,{"data-ds-id":"SearchInput","data-e2e-test-id":dataE2eTestId,label:label,labelHint:labelHint,hideLabel:hideLabel,hint:hint,errorMessages:errorMessages,messageId:id},_react.default.createElement(StyledSearchInputContainer,null,_react.default.createElement(_Input.InputRaw,{...rest,ref:inputRef,type:"text",size:"s",value:value,placeholder:!readOnly&&placeholder,autoComplete:autoComplete,readOnly:readOnly,...ariaDescribedByProp}),_react.default.createElement(IconsContainer,null,_react.default.createElement(_Icon.Icon,{name:"search",size:"s",color:readOnly?"quaternary":"tertiary"}),!!value&&!readOnly&&_react.default.createElement(_PictogramButton.PictogramButton,{icon:"x",size:"xs",color:"tertiary","aria-label":slotProps?.clearButton?.ariaLabel,onClick:e=>{e.preventDefault(),onClear(e),inputRef.current.focus()}}))))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"SearchInput",{enumerable:!0,get:function(){return SearchInput}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/require("@swc/helpers/_/_interop_require_wildcard")._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_useIntl=require("../../../shared/intl/useIntl"),_icon_sizes_mapjson=/*#__PURE__*/_interop_require_default._(require("../../../web-tokens/_icon_sizes_map.json")),_Icon=require("../../Icon/Icon"),_PictogramButton=require("../../PictogramButton/PictogramButton"),_Input=require("../Input/Input"),_FormField=require("../FormField/FormField"),_useFormFieldMessageId=require("../FormField/useFormFieldMessageId"),iconSizes=_icon_sizes_mapjson.default.icons,StyledSearchInputContainer=(0,_styled.default)("div",{target:"e1b1l7xz0",label:"StyledSearchInputContainer"})(({theme})=>({position:"relative",backgroundColor:theme.values.color.searchInput.background.default,borderRadius:theme.variables.size.borderRadius.xs,height:theme.variables.size.spacing.xl,width:"100%","& input":{backgroundColor:theme.values.color.background.transparent.default,paddingTop:theme.variables.size.spacing.xxs,paddingBottom:theme.variables.size.spacing.xxs,paddingLeft:`calc(${theme.variables.size.spacing.s} + ${iconSizes.s})`,paddingRight:theme.variables.size.spacing.xl,borderWidth:0,textOverflow:"ellipsis","&::placeholder":{color:theme.values.color.text.tertiary.default,fontStyle:"italic"}}})),IconsContainer=(0,_styled.default)("div",{target:"e1b1l7xz1",label:"IconsContainer"})(({theme})=>({display:"flex",alignItems:"center",justifyContent:"space-between",position:"absolute",inset:`0 ${theme.variables.size.spacing.xs}`,"& > div":{lineHeight:0}})),SearchInput=({value,placeholder,autoComplete="on",readOnly,label,labelHint,hideLabel=!0,hint,errorMessages,"aria-describedby":ariaDescribedBy,"data-e2e-test-id":dataE2eTestId,onClear=()=>null,slotProps,...rest})=>{let inputRef=(0,_react.useRef)(null),{formatMessage}=(0,_useIntl.useIntl)(),{id,ariaDescribedByProp}=(0,_useFormFieldMessageId.useFormFieldMessageId)({ariaDescribedBy,errorMessages,hint});return _react.default.createElement(_FormField.FormField,{"data-ds-id":"SearchInput","data-e2e-test-id":dataE2eTestId,label:label,labelHint:labelHint,hideLabel:hideLabel,hint:hint,errorMessages:errorMessages,messageId:id},_react.default.createElement(StyledSearchInputContainer,null,_react.default.createElement(_Input.InputRaw,{...rest,ref:inputRef,type:"text",size:"s",value:value,placeholder:readOnly?void 0:placeholder,autoComplete:autoComplete,readOnly:readOnly,...ariaDescribedByProp}),_react.default.createElement(IconsContainer,null,_react.default.createElement(_Icon.Icon,{name:"search",size:"s",color:readOnly?"quaternary":"tertiary"}),!!value&&!readOnly&&_react.default.createElement(_PictogramButton.PictogramButton,{icon:"x",size:"xs",color:"tertiary","aria-label":slotProps?.clearButton?.ariaLabel??formatMessage("SearchInput.ClearButton.AriaLabel"),onClick:e=>{e.preventDefault(),onClear(e),inputRef.current?.focus()}}))))};

package/build/cjs/components/Form/SegmentedControl/-types.d.ts

@@ -1,12 +1,12 @@
 import type { FormEvent, ChangeEvent, ReactNode, ReactElement } from "react";
-import type { IconName } from "src";
+import type { IconName } from "../../../index.js";
 import type { FormFieldGroupProps } from "../../../components/Form/FormFieldGroup/FormFieldGroup";
 import type { TooltipProps } from "../../../components/Tooltip/Tooltip";
 import type { SlotProps } from "../../../shared/slotProps";
 export type RenderOptionWrapperProps = {
     option: ReactNode;
     checked: boolean;
-    disabled: boolean;
+    disabled?: boolean;
     value: string;
 };
 export type SegmentedControlOption = {

package/build/cjs/components/Form/SegmentedControl/SegmentedControl.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"SegmentedControl",{enumerable:!0,get:function(){return SegmentedControl}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/require("@swc/helpers/_/_interop_require_wildcard")._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_breakpointsjson=/*#__PURE__*/_interop_require_default._(require("../../../web-tokens/_breakpoints.json")),_FormFieldGroup=require("../FormFieldGroup/FormFieldGroup"),_SegmentedControlOption=require("./SegmentedControlOption"),StyledDivider=(0,_styled.default)("div",{target:"e1yfjg690",label:"StyledDivider"})(({theme,isChecked,isDisabled,isPrevOptionChecked,isPrevOptionDisabled,justified})=>{let border=`1px solid ${theme.values.color.border.secondary.default}`,otherStyles={backgroundColor:theme.values.color.background.primary.default,...(isChecked||isPrevOptionChecked)&&{borderColor:theme.values.color.border.accent.default},...isDisabled&&isPrevOptionDisabled&&{opacity:theme.variables.opacity.disabled}},borderRightStyle={borderRight:border,...otherStyles};return justified?{[`@media (min-width: ${_breakpointsjson.default.m.value}px)`]:{...borderRightStyle},[`@media (max-width: ${_breakpointsjson.default.m.value}px)`]:{borderBottom:border,...otherStyles}}:borderRightStyle}),StyledContainer=(0,_styled.default)("div",{target:"e1yfjg691",label:"StyledContainer"})(({justified,options})=>{let baseStyle={display:"flex"};return justified?{...baseStyle,flexDirection:"column","& > *":{flex:`1 1 ${100/options.length}%`},[`& > ${StyledDivider}`]:{flex:"0 0 auto"},[`@media (min-width: ${_breakpointsjson.default.m.value}px)`]:{flexDirection:"row"}}:baseStyle});function SegmentedControl({options,value,justified,size="m",onChange,isLabelHidden=!0,renderOptionWrapper,...rest}){let isSingleOption=1===options.length,handleChange=evt=>{let target=evt.target;isSingleOption?onChange(target.checked?target.value:""):onChange(target.value)},optionElms=options.map(({value:optionValue,disabled,...otherProps},index)=>{let isChecked=value===optionValue,isPrevOptionChecked=options[index-1]?.value===value,isPrevOptionDisabled=options[index-1]?.disabled,dividerElm=_react.default.createElement(StyledDivider,{isPrevOptionChecked:isPrevOptionChecked,isPrevOptionDisabled:isPrevOptionDisabled,isChecked:isChecked,isDisabled:disabled,justified:justified}),isRightDivider=index!==options.length-1&&isChecked,optionElm=_react.default.createElement(_react.default.Fragment,null,0!==index&&!isPrevOptionChecked&&dividerElm,_react.default.createElement(_SegmentedControlOption.SegmentedControlOption,{value:optionValue,size:size,checked:isChecked,isResponsive:justified,disabled:disabled,inputType:isSingleOption?"checkbox":"radio",onChange:handleChange,...otherProps}),isRightDivider&&dividerElm),wrappedOptionElm=renderOptionWrapper?renderOptionWrapper({option:optionElm,checked:isChecked,disabled,value:optionValue}):optionElm;return _react.default.createElement(_react.Fragment,{key:optionValue},wrappedOptionElm)});return _react.default.createElement(_FormFieldGroup.FormFieldGroup,{"data-ds-id":"SegmentedControl",isLabelHidden:isLabelHidden,...rest},_react.default.createElement(StyledContainer,{justified:justified,options:options},optionElms))}
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"SegmentedControl",{enumerable:!0,get:function(){return SegmentedControl}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/require("@swc/helpers/_/_interop_require_wildcard")._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_breakpointsjson=/*#__PURE__*/_interop_require_default._(require("../../../web-tokens/_breakpoints.json")),_FormFieldGroup=require("../FormFieldGroup/FormFieldGroup"),_SegmentedControlOption=require("./SegmentedControlOption"),StyledDivider=(0,_styled.default)("div",{target:"e1qdakvf0",label:"StyledDivider"})(({theme,isChecked,isDisabled,isPrevOptionChecked,isPrevOptionDisabled,justified})=>{let border=`1px solid ${theme.values.color.border.secondary.default}`,otherStyles={backgroundColor:theme.values.color.background.primary.default,...(isChecked||isPrevOptionChecked)&&{borderColor:theme.values.color.border.accent.default},...isDisabled&&isPrevOptionDisabled&&{opacity:theme.variables.opacity.disabled}},borderRightStyle={borderRight:border,...otherStyles};return justified?{[`@media (min-width: ${_breakpointsjson.default.m.value}px)`]:{...borderRightStyle},[`@media (max-width: ${_breakpointsjson.default.m.value}px)`]:{borderBottom:border,...otherStyles}}:borderRightStyle}),StyledContainer=(0,_styled.default)("div",{target:"e1qdakvf1",label:"StyledContainer"})(({justified,options})=>{let baseStyle={display:"flex"};return justified?{...baseStyle,flexDirection:"column","& > *":{flex:`1 1 ${100/options.length}%`},[`& > ${StyledDivider}`]:{flex:"0 0 auto"},[`@media (min-width: ${_breakpointsjson.default.m.value}px)`]:{flexDirection:"row"}}:baseStyle});function SegmentedControl({options,value,justified,size="m",onChange,isLabelHidden=!0,renderOptionWrapper,...rest}){let isSingleOption=1===options.length,handleChange=evt=>{let target=evt.target;isSingleOption?onChange(target.checked?target.value:""):onChange(target.value)},optionElms=options.map(({value:optionValue,disabled,...otherProps},index)=>{let isChecked=value===optionValue,isPrevOptionChecked=options[index-1]?.value===value,isPrevOptionDisabled=options[index-1]?.disabled,dividerElm=_react.default.createElement(StyledDivider,{isPrevOptionChecked:isPrevOptionChecked,isPrevOptionDisabled:isPrevOptionDisabled,isChecked:isChecked,isDisabled:disabled,justified:justified}),isRightDivider=index!==options.length-1&&isChecked,optionElm=_react.default.createElement(_react.default.Fragment,null,0!==index&&!isPrevOptionChecked&&dividerElm,_react.default.createElement(_SegmentedControlOption.SegmentedControlOption,{value:optionValue,size:size,checked:isChecked,isResponsive:justified,disabled:disabled,inputType:isSingleOption?"checkbox":"radio",onChange:handleChange,...otherProps}),isRightDivider&&dividerElm),wrappedOptionElm=renderOptionWrapper?renderOptionWrapper({option:optionElm,checked:isChecked,disabled,value:optionValue}):optionElm;return _react.default.createElement(_react.Fragment,{key:optionValue},wrappedOptionElm)});return _react.default.createElement(_FormFieldGroup.FormFieldGroup,{"data-ds-id":"SegmentedControl",isLabelHidden:isLabelHidden,...rest},_react.default.createElement(StyledContainer,{justified:justified,options:options},optionElms))}

package/build/cjs/components/Form/SegmentedControl/SegmentedControlOption.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"SegmentedControlOption",{enumerable:!0,get:function(){return SegmentedControlOption}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/require("@swc/helpers/_/_interop_require_wildcard")._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_breakpointsjson=/*#__PURE__*/_interop_require_default._(require("../../../web-tokens/_breakpoints.json")),_Text=require("../../Typography/Text/Text"),_Icon=require("../../Icon/Icon"),_ScreenReaderText=require("../../Utilities/ScreenReaderText/ScreenReaderText"),_Tooltip=require("../../Tooltip/Tooltip"),_Inline=require("../../Inline/Inline"),_mixins=require("../../../shared/mixins"),StyledInput=(0,_styled.default)("input",{target:"etj54850",label:"StyledInput"})(({theme})=>({position:"absolute",height:1,width:1,margin:-1,overflow:"hidden",padding:0,opacity:theme.variables.opacity.hidden})),StyledLabel=(0,_styled.default)(_Text.Text,{target:"etj54851",label:"StyledLabel"})(({theme,size})=>({..."s"===size&&{lineHeight:theme.variables.size.lineHeight.xs}})),StyledSublabel=(0,_styled.default)(_Text.Text,{target:"etj54852",label:"StyledSublabel"})(({theme,isResponsive})=>{let baseStyle={textAlign:"center"};return isResponsive?{...baseStyle,[`@media (max-width: ${_breakpointsjson.default.m.value}px)`]:{lineHeight:theme.variables.size.lineHeight.xs,textAlign:"right",marginLeft:theme.variables.size.spacing.m}}:baseStyle}),StyledIconContainer=(0,_styled.default)("div",{target:"etj54853",label:"StyledIconContainer"})(),StyledContainer=(0,_styled.default)("label",{target:"etj54854",label:"StyledContainer"})(({theme,size,checked,isResponsive,sublabel,iconOnly,displayAsOptionWithSublabel,disabled})=>{let borderStyle={"&:first-of-type":{borderTopLeftRadius:theme.variables.size.borderRadius.xs,borderBottomLeftRadius:theme.variables.size.borderRadius.xs,borderLeftStyle:"solid"},"&:last-of-type":{borderTopRightRadius:theme.variables.size.borderRadius.xs,borderBottomRightRadius:theme.variables.size.borderRadius.xs,borderRightStyle:"solid"}},basePaddingSize="s"===size?theme.variables.size.spacing.xs:theme.variables.size.spacing.s,basePadding=`calc(${basePaddingSize} - 1px)`,baseStyle={position:"relative",cursor:"pointer",backgroundColor:theme.values.color.background.primary.default,display:"flex",flexDirection:"column",justifyContent:"center",alignItems:"center",border:`1px solid ${theme.values.color.border.secondary.default}`,borderLeftStyle:"none",borderRightStyle:"none",padding:(()=>{if(iconOnly)return"l"===size?`calc(${theme.variables.size.spacing.m} - 1px)`:basePadding;let horizontalPadding="s"===size?theme.variables.size.spacing.m:theme.variables.size.spacing.l;return`${basePadding} ${horizontalPadding}`})(),...!checked&&!disabled&&{"&:hover":{backgroundColor:theme.values.color.background.secondary.default}},...disabled&&{cursor:"not-allowed",opacity:theme.variables.opacity.disabled},...checked&&(0,_mixins.getPressedStyles)({theme}),[`${StyledSublabel}, ${StyledLabel}, ${StyledIconContainer}`]:{color:theme.values.color.text.secondary.default,...checked&&{color:theme.values.color.text.accent.default}},[`&:has(${StyledInput}:focus-visible)`]:{outlineWidth:2,outlineStyle:"solid",outlineColor:"Highlight",outlineOffset:-1,"@media (-webkit-min-device-pixel-ratio:0)":{outlineColor:"-webkit-focus-ring-color",outlineStyle:"solid"}}};return isResponsive?{...baseStyle,[`@media (min-width: ${_breakpointsjson.default.m.value}px)`]:{...borderStyle},[`@media (max-width: ${_breakpointsjson.default.m.value}px)`]:{flexDirection:"row",justifyContent:sublabel||displayAsOptionWithSublabel?"space-between":"center",padding:theme.variables.size.spacing.m,borderTopStyle:"none",borderBottomStyle:"none",borderLeftStyle:"solid",borderRightStyle:"solid","&:first-of-type":{borderTopLeftRadius:theme.variables.size.borderRadius.xs,borderTopRightRadius:theme.variables.size.borderRadius.xs,borderTopStyle:"solid"},"&:last-of-type":{borderBottomLeftRadius:theme.variables.size.borderRadius.xs,borderBottomRightRadius:theme.variables.size.borderRadius.xs,borderBottomStyle:"solid"}}}:{...baseStyle,...borderStyle}});function SegmentedControlOption({name,value="",checked,label="",sublabel,iconName,iconOnly,slotProps,tooltipContent,tooltipPlacement,tooltipPortalContainer,size,disabled=!1,isResponsive=!1,inputType="radio",displayAsOptionWithSublabel=!1,onChange,onClick,onBlur,onFocus,onTooltipVisibilityChange}){let containerRef=(0,_react.useRef)(null),iconAriaLabel=iconOnly?label:void 0,iconElm=iconName?_react.default.createElement(StyledIconContainer,null,_react.default.createElement(_Icon.Icon,{name:iconName,size:"s","aria-label":slotProps?.icon?.ariaLabel??iconAriaLabel,role:"img"})):null,showIcon=!sublabel&&iconElm,labelElm=_react.default.createElement(StyledLabel,{size:"l"===size?"m":"s",weight:"bold"},label),labelContainerElm=labelElm;showIcon&&(labelContainerElm=iconOnly?_react.default.createElement(_react.default.Fragment,null,iconElm,_react.default.createElement(_ScreenReaderText.ScreenReaderText,null,label)):_react.default.createElement(_Inline.Inline,{space:"xs",noWrap:!0,vAlignItems:"center"},iconElm,labelElm));let sublabelElm=sublabel?_react.default.createElement(StyledSublabel,{size:"s",isResponsive:isResponsive},sublabel):null;return _react.default.createElement(_react.default.Fragment,null,_react.default.createElement(StyledContainer,{size:size,checked:checked,sublabel:sublabel,iconOnly:iconOnly,isResponsive:isResponsive,displayAsOptionWithSublabel:displayAsOptionWithSublabel,ref:containerRef,disabled:disabled,tabIndex:-1},_react.default.createElement(StyledInput,{type:inputType,name:name,value:value,checked:checked,disabled:disabled,onChange:onChange,onClick:onClick,onBlur:onBlur,onFocus:onFocus,"aria-expanded":slotProps?.input?.ariaExpanded,"aria-controls":slotProps?.input?.ariaControls}),labelContainerElm,sublabelElm),!!tooltipContent&&_react.default.createElement(_Tooltip.Tooltip,{content:tooltipContent,externalTriggerRef:containerRef,onVisibilityChange:onTooltipVisibilityChange,placement:tooltipPlacement??"auto",portalContainer:tooltipPortalContainer}))}
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"SegmentedControlOption",{enumerable:!0,get:function(){return SegmentedControlOption}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/require("@swc/helpers/_/_interop_require_wildcard")._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_breakpointsjson=/*#__PURE__*/_interop_require_default._(require("../../../web-tokens/_breakpoints.json")),_Text=require("../../Typography/Text/Text"),_Icon=require("../../Icon/Icon"),_ScreenReaderText=require("../../Utilities/ScreenReaderText/ScreenReaderText"),_Tooltip=require("../../Tooltip/Tooltip"),_Inline=require("../../Inline/Inline"),_mixins=require("../../../shared/mixins"),StyledInput=(0,_styled.default)("input",{target:"eve0hq10",label:"StyledInput"})(({theme})=>({position:"absolute",height:1,width:1,margin:-1,overflow:"hidden",padding:0,opacity:theme.variables.opacity.hidden})),StyledLabel=(0,_styled.default)(_Text.Text,{target:"eve0hq11",label:"StyledLabel"})(({theme,size})=>({..."s"===size&&{lineHeight:theme.variables.size.lineHeight.xs}})),StyledSublabel=(0,_styled.default)(_Text.Text,{target:"eve0hq12",label:"StyledSublabel"})(({theme,isResponsive})=>{let baseStyle={textAlign:"center"};return isResponsive?{...baseStyle,[`@media (max-width: ${_breakpointsjson.default.m.value}px)`]:{lineHeight:theme.variables.size.lineHeight.xs,textAlign:"right",marginLeft:theme.variables.size.spacing.m}}:baseStyle}),StyledIconContainer=(0,_styled.default)("div",{target:"eve0hq13",label:"StyledIconContainer"})(),StyledContainer=(0,_styled.default)("label",{target:"eve0hq14",label:"StyledContainer"})(({theme,size,checked,isResponsive,sublabel,iconOnly,displayAsOptionWithSublabel,disabled})=>{let borderStyle={"&:first-of-type":{borderTopLeftRadius:theme.variables.size.borderRadius.xs,borderBottomLeftRadius:theme.variables.size.borderRadius.xs,borderLeftStyle:"solid"},"&:last-of-type":{borderTopRightRadius:theme.variables.size.borderRadius.xs,borderBottomRightRadius:theme.variables.size.borderRadius.xs,borderRightStyle:"solid"}},basePaddingSize="s"===size?theme.variables.size.spacing.xs:theme.variables.size.spacing.s,basePadding=`calc(${basePaddingSize} - 1px)`,baseStyle={position:"relative",cursor:"pointer",backgroundColor:theme.values.color.background.primary.default,display:"flex",flexDirection:"column",justifyContent:"center",alignItems:"center",border:`1px solid ${theme.values.color.border.secondary.default}`,borderLeftStyle:"none",borderRightStyle:"none",padding:(()=>{if(iconOnly)return"l"===size?`calc(${theme.variables.size.spacing.m} - 1px)`:basePadding;let horizontalPadding="s"===size?theme.variables.size.spacing.m:theme.variables.size.spacing.l;return`${basePadding} ${horizontalPadding}`})(),...!checked&&!disabled&&{"&:hover":{backgroundColor:theme.values.color.background.secondary.default}},...disabled&&{cursor:"not-allowed",opacity:theme.variables.opacity.disabled},...checked&&(0,_mixins.getPressedStyles)({theme}),[`${StyledSublabel}, ${StyledLabel}, ${StyledIconContainer}`]:{color:theme.values.color.text.secondary.default,...checked&&{color:theme.values.color.text.accent.default}},[`&:has(${StyledInput}:focus-visible)`]:{outlineWidth:2,outlineStyle:"solid",outlineColor:"Highlight",outlineOffset:-1,"@media (-webkit-min-device-pixel-ratio:0)":{outlineColor:"-webkit-focus-ring-color",outlineStyle:"solid"}}};return isResponsive?{...baseStyle,[`@media (min-width: ${_breakpointsjson.default.m.value}px)`]:{...borderStyle},[`@media (max-width: ${_breakpointsjson.default.m.value}px)`]:{flexDirection:"row",justifyContent:sublabel||displayAsOptionWithSublabel?"space-between":"center",padding:theme.variables.size.spacing.m,borderTopStyle:"none",borderBottomStyle:"none",borderLeftStyle:"solid",borderRightStyle:"solid","&:first-of-type":{borderTopLeftRadius:theme.variables.size.borderRadius.xs,borderTopRightRadius:theme.variables.size.borderRadius.xs,borderTopStyle:"solid"},"&:last-of-type":{borderBottomLeftRadius:theme.variables.size.borderRadius.xs,borderBottomRightRadius:theme.variables.size.borderRadius.xs,borderBottomStyle:"solid"}}}:{...baseStyle,...borderStyle}});function SegmentedControlOption({name,value="",checked,label="",sublabel,iconName,iconOnly,slotProps,tooltipContent,tooltipPlacement,tooltipPortalContainer,size,disabled=!1,isResponsive=!1,inputType="radio",displayAsOptionWithSublabel=!1,onChange,onClick,onBlur,onFocus,onTooltipVisibilityChange}){let containerRef=(0,_react.useRef)(null),iconAriaLabel=iconOnly?label:void 0,iconAccessibleName=slotProps?.icon?.ariaLabel??iconAriaLabel,iconElm=iconName?_react.default.createElement(StyledIconContainer,null,iconAccessibleName?_react.default.createElement(_Icon.Icon,{name:iconName,size:"s","aria-label":iconAccessibleName,role:"img"}):_react.default.createElement(_Icon.Icon,{name:iconName,size:"s"})):null,showIcon=!sublabel&&iconElm,labelElm=_react.default.createElement(StyledLabel,{size:"l"===size?"m":"s",weight:"bold"},label),labelContainerElm=labelElm;showIcon&&(labelContainerElm=iconOnly?_react.default.createElement(_react.default.Fragment,null,iconElm,_react.default.createElement(_ScreenReaderText.ScreenReaderText,null,label)):_react.default.createElement(_Inline.Inline,{space:"xs",noWrap:!0,vAlignItems:"center"},iconElm,labelElm));let sublabelElm=sublabel?_react.default.createElement(StyledSublabel,{size:"s",isResponsive:isResponsive},sublabel):null;return _react.default.createElement(_react.default.Fragment,null,_react.default.createElement(StyledContainer,{size:size,checked:checked,sublabel:sublabel,iconOnly:iconOnly,isResponsive:isResponsive,displayAsOptionWithSublabel:displayAsOptionWithSublabel,ref:containerRef,disabled:disabled,tabIndex:-1},_react.default.createElement(StyledInput,{type:inputType,name:name,value:value,checked:checked,disabled:disabled,onChange:onChange,onClick:onClick,onBlur:onBlur,onFocus:onFocus,"aria-expanded":slotProps?.input?.ariaExpanded,"aria-controls":slotProps?.input?.ariaControls}),labelContainerElm,sublabelElm),tooltipContent&&_react.default.createElement(_Tooltip.Tooltip,{content:tooltipContent,externalTriggerRef:containerRef,onVisibilityChange:onTooltipVisibilityChange,placement:tooltipPlacement??"auto",portalContainer:tooltipPortalContainer}))}

package/build/cjs/components/Form/Select/Select.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"Select",{enumerable:!0,get:function(){return Select}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/_interop_require_default._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_FormField=require("../FormField/FormField"),_SelectWithCustomTrigger=require("./SelectWithCustomTrigger"),_Icon=require("../../Icon/Icon"),_Inline=require("../../Inline/Inline"),_TextClamped=require("../../Typography/TextClamped/TextClamped"),_useFormFieldMessageId=require("../FormField/useFormFieldMessageId"),StyledButton=(0,_styled.default)("button",{target:"e1w5svy60",label:"StyledButton"})(({theme,hasError,isPlaceholderVisible,readOnly,size})=>({'&[type="button"]':{appearance:"none",MozAppearance:"none",WebkitAppearance:"none"},display:"inline-block",margin:0,borderRadius:theme.variables.size.borderRadius.xs,backgroundColor:theme.values.color.background.primary.default,borderWidth:"1px",borderStyle:"solid",width:"100%",padding:`${"s"===size?`calc(${theme.variables.size.spacing.xxs} + 1px)`:`calc(${theme.variables.size.spacing.xs} - 1px)`} ${theme.variables.size.spacing.s}`,paddingRight:theme.variables.size.spacing.xs,boxSizing:"border-box",borderColor:theme.values.color.border.primary.default,...readOnly&&{borderColor:theme.values.color.border.primary.disabled},...isPlaceholderVisible&&{fontStyle:"italic"},...hasError&&{boxShadow:`0 0 0 1px inset ${theme.values.color.border.error.default}`,borderColor:theme.values.color.border.error.default}})),StyledTriggerIcon=(0,_styled.default)(_Icon.Icon,{target:"e1w5svy61",label:"StyledTriggerIcon"})(()=>({pointerEvents:"none"}));function TriggerButton({triggerRef,disabled,isOpen,hasError,isPlaceholderVisible,role,"aria-expanded":ariaExpanded,"aria-controls":ariaControls,"aria-activedescendant":ariaActiveDescendant,"aria-describedby":ariaDescribedBy,"aria-label":ariaLabel,readOnly,size,onFocus,onBlur,children,...ariaAttributes}){return _react.default.createElement(StyledButton,{type:"button",ref:triggerRef,disabled:disabled,hasError:hasError,isPlaceholderVisible:isPlaceholderVisible,...ariaAttributes,role:role,"aria-expanded":ariaExpanded,"aria-controls":ariaControls,"aria-activedescendant":ariaActiveDescendant,"aria-label":ariaLabel,"aria-invalid":hasError,"aria-describedby":ariaDescribedBy,readOnly:readOnly,size:size,onFocus:onFocus,onBlur:onBlur},_react.default.createElement(_Inline.Inline,{vAlignItems:"center",alignItems:"spaceBetween",space:"xxs",noWrap:!0},_react.default.createElement(_TextClamped.TextClamped,{color:isPlaceholderVisible?"tertiary":"primary",size:size},readOnly&&isPlaceholderVisible?null:children),_react.default.createElement(StyledTriggerIcon,{size:size,name:isOpen?"chevron-up":"chevron-down",color:readOnly?"quaternary":"tertiary"})))}function Select({options,name,value,placeholder,hasError,optionsListWidth,maxHeight,disabled,portalContainer,readOnly=!1,excludeFromFormData,label,labelHint,hideLabel,hint,errorMessages,size="m","data-e2e-test-id":dataE2eTestId,"aria-describedby":ariaDescribedBy,onChange,onFocus,onBlur,...ariaAttributes}){let selectedOption=options?.find(option=>option.value===value),isPlaceholderVisible=placeholder&&!value,{id,ariaDescribedByProp}=(0,_useFormFieldMessageId.useFormFieldMessageId)({ariaDescribedBy,errorMessages,hint});return _react.default.createElement(_SelectWithCustomTrigger.SelectWithCustomTrigger,{options:options,value:value,name:name,optionsListWidth:optionsListWidth,maxHeight:maxHeight,portalContainer:portalContainer,disabled:disabled,readOnly:readOnly,excludeFromFormData:excludeFromFormData,onChange:onChange,renderTrigger:({triggerRef,isOpen,role,"aria-expanded":ariaExpanded,"aria-controls":ariaControls,"aria-activedescendant":ariaActiveDescendant})=>_react.default.createElement(_FormField.FormField,{disabled:disabled,hideLabel:hideLabel,label:label,labelHint:labelHint,hint:hint,errorMessages:errorMessages,messageId:id,"data-e2e-test-id":dataE2eTestId,"data-ds-id":"Select"},_react.default.createElement(TriggerButton,{hasError:hasError,isPlaceholderVisible:isPlaceholderVisible,size:size,triggerRef:triggerRef,isOpen:isOpen,disabled:disabled,role:role,"aria-expanded":ariaExpanded,"aria-controls":ariaControls,"aria-activedescendant":ariaActiveDescendant,"aria-label":label,...ariaAttributes,...ariaDescribedByProp,readOnly:readOnly,onFocus:onFocus,onBlur:onBlur},selectedOption?selectedOption.label:placeholder))})}
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"Select",{enumerable:!0,get:function(){return Select}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/_interop_require_default._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_FormField=require("../FormField/FormField"),_SelectWithCustomTrigger=require("./SelectWithCustomTrigger"),_Icon=require("../../Icon/Icon"),_Inline=require("../../Inline/Inline"),_TextClamped=require("../../Typography/TextClamped/TextClamped"),_useFormFieldMessageId=require("../FormField/useFormFieldMessageId"),StyledButton=(0,_styled.default)("button",{target:"emffu2u0",label:"StyledButton"})(({theme,hasError,isPlaceholderVisible,readOnly,size})=>({'&[type="button"]':{appearance:"none",MozAppearance:"none",WebkitAppearance:"none"},display:"inline-block",margin:0,borderRadius:theme.variables.size.borderRadius.xs,backgroundColor:theme.values.color.background.primary.default,borderWidth:"1px",borderStyle:"solid",width:"100%",padding:`${"s"===size?`calc(${theme.variables.size.spacing.xxs} + 1px)`:`calc(${theme.variables.size.spacing.xs} - 1px)`} ${theme.variables.size.spacing.s}`,paddingRight:theme.variables.size.spacing.xs,boxSizing:"border-box",borderColor:theme.values.color.border.primary.default,...readOnly&&{borderColor:theme.values.color.border.primary.disabled},...isPlaceholderVisible&&{fontStyle:"italic"},...hasError&&{boxShadow:`0 0 0 1px inset ${theme.values.color.border.error.default}`,borderColor:theme.values.color.border.error.default}})),StyledTriggerIcon=(0,_styled.default)(_Icon.Icon,{target:"emffu2u1",label:"StyledTriggerIcon"})(()=>({pointerEvents:"none"}));function TriggerButton({triggerRef,disabled,isOpen,hasError,isPlaceholderVisible,role,"aria-expanded":ariaExpanded,"aria-controls":ariaControls,"aria-activedescendant":ariaActiveDescendant,"aria-describedby":ariaDescribedBy,"aria-label":ariaLabel,readOnly,size,onFocus,onBlur,children,...ariaAttributes}){return _react.default.createElement(StyledButton,{type:"button",ref:triggerRef,disabled:disabled,hasError:hasError,isPlaceholderVisible:isPlaceholderVisible,...ariaAttributes,role:role,"aria-expanded":ariaExpanded,"aria-controls":ariaControls,"aria-activedescendant":ariaActiveDescendant,"aria-label":ariaLabel,"aria-invalid":hasError,"aria-describedby":ariaDescribedBy,readOnly:readOnly,size:size,onFocus:onFocus,onBlur:onBlur},_react.default.createElement(_Inline.Inline,{vAlignItems:"center",alignItems:"spaceBetween",space:"xxs",noWrap:!0},_react.default.createElement(_TextClamped.TextClamped,{color:isPlaceholderVisible?"tertiary":"primary",size:size},readOnly&&isPlaceholderVisible?null:children),_react.default.createElement(StyledTriggerIcon,{size:size,name:isOpen?"chevron-up":"chevron-down",color:readOnly?"quaternary":"tertiary"})))}function Select({options,name,value,placeholder,hasError,optionsListWidth,maxHeight,disabled=!1,portalContainer,readOnly=!1,excludeFromFormData,label,labelHint,hideLabel,hint,errorMessages,size="m","data-e2e-test-id":dataE2eTestId,"aria-describedby":ariaDescribedBy,onChange,onFocus,onBlur,...ariaAttributes}){let selectedOption=options?.find(option=>option.value===value),isPlaceholderVisible=!!placeholder&&!value,{id,ariaDescribedByProp}=(0,_useFormFieldMessageId.useFormFieldMessageId)({ariaDescribedBy,errorMessages,hint});return _react.default.createElement(_SelectWithCustomTrigger.SelectWithCustomTrigger,{options:options,value:value,name:name,optionsListWidth:optionsListWidth,maxHeight:maxHeight,portalContainer:portalContainer,disabled:disabled,readOnly:readOnly,excludeFromFormData:excludeFromFormData,onChange:onChange,renderTrigger:({triggerRef,isOpen,role,"aria-expanded":ariaExpanded,"aria-controls":ariaControls,"aria-activedescendant":ariaActiveDescendant})=>_react.default.createElement(_FormField.FormField,{disabled:disabled,hideLabel:hideLabel,label:label,labelHint:labelHint,hint:hint,errorMessages:errorMessages,messageId:id,"data-e2e-test-id":dataE2eTestId,"data-ds-id":"Select"},_react.default.createElement(TriggerButton,{hasError:hasError,isPlaceholderVisible:isPlaceholderVisible,size:size,triggerRef:triggerRef,isOpen:isOpen,disabled:disabled,role:role,"aria-expanded":ariaExpanded,"aria-controls":ariaControls,"aria-activedescendant":ariaActiveDescendant,"aria-label":label,...ariaAttributes,...ariaDescribedByProp,readOnly:readOnly,onFocus:onFocus,onBlur:onBlur},selectedOption?selectedOption.label:placeholder??""))})}

package/build/cjs/components/Form/Select/SelectWithCustomTrigger.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"SelectWithCustomTrigger",{enumerable:!0,get:function(){return SelectWithCustomTrigger}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/require("@swc/helpers/_/_interop_require_wildcard")._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_OptionsList=require("../Combobox/OptionsList"),_useKeyboard=require("../../../shared/useKeyboard"),_useTypeAheadSearch=require("./useTypeAheadSearch"),HiddenSelectInput=(0,_styled.default)("select",{target:"ezvwo4c0",label:"HiddenSelectInput"})(()=>({display:"none"}));function SelectWithCustomTrigger({renderTrigger,optionsListWidth,options,name,value,portalContainer,disabled,maxHeight=230,autoComplete="on",readOnly=!1,excludeFromFormData=!1,onChange}){let[isOpen,setIsOpen]=(0,_react.useState)(!1),[selectedIndex,setSelectedIndex]=(0,_react.useState)(-1),triggerRef=(0,_react.useRef)(null),hiddenSelectRef=(0,_react.useRef)(null),currentOptionIndex=(0,_react.useMemo)(()=>options.findIndex(option=>option.value===value),[options,value]),closeOptionsList=(0,_react.useCallback)(()=>{isOpen&&(setIsOpen(!1),setSelectedIndex(-1))},[isOpen]),openOptionsList=(0,_react.useCallback)(()=>{isOpen||readOnly||(setIsOpen(!0),triggerRef.current?.focus())},[isOpen,readOnly]),toggleOptionsList=(0,_react.useCallback)(()=>{isOpen?closeOptionsList():openOptionsList()},[isOpen,openOptionsList,closeOptionsList]),handleSelectedIndexChange=(0,_react.useCallback)(index=>setSelectedIndex(index),[]),handleChange=(0,_react.useCallback)(option=>{hiddenSelectRef.current.value=option.value,hiddenSelectRef.current.dispatchEvent(new Event("change",{bubbles:!0}))},[hiddenSelectRef]),handleSearchMatch=(0,_react.useCallback)(matchedIndex=>{-1!==matchedIndex&&(isOpen?setSelectedIndex(matchedIndex):handleChange(options[matchedIndex]))},[isOpen,options,setSelectedIndex,handleChange]);(0,_useKeyboard.useKeyboard)({"Enter Space ArrowUp ArrowDown":()=>{openOptionsList()}},triggerRef,!isOpen&&!disabled),(0,_useTypeAheadSearch.useTypeAheadSearch)({options,triggerRef,isActive:!disabled,fromIndex:-1!==selectedIndex?selectedIndex:currentOptionIndex,onMatch:handleSearchMatch}),(0,_react.useEffect)(()=>{let triggerElm=triggerRef.current,handlePointerDown=evt=>{evt.preventDefault()};return triggerElm&&!disabled&&(triggerElm.setAttribute("tabIndex","0"),triggerElm.addEventListener("click",toggleOptionsList),triggerElm.addEventListener("blur",closeOptionsList),triggerElm.addEventListener("pointerdown",handlePointerDown)),()=>{triggerElm?.removeEventListener("click",toggleOptionsList),triggerElm?.removeEventListener("blur",closeOptionsList),triggerElm?.removeEventListener("pointerdown",handlePointerDown)}},[triggerRef,disabled,closeOptionsList,toggleOptionsList]),(0,_react.useEffect)(()=>{let triggerElm=triggerRef.current,handleEscapeKeyDown=evt=>{"Escape"===evt.code&&(evt.preventDefault(),evt.stopPropagation(),closeOptionsList())};return triggerElm&&isOpen&&triggerElm.addEventListener("keydown",handleEscapeKeyDown),()=>{triggerElm?.removeEventListener("keydown",handleEscapeKeyDown)}},[triggerRef,isOpen,closeOptionsList]);let optionsListId=(0,_OptionsList.getOptionsListId)(name),ariaActiveDescendant=-1!==selectedIndex?(0,_OptionsList.getOptionId)(name,options[selectedIndex].value):"",triggerElm=renderTrigger({triggerRef,isOpen,disabled,role:"combobox","aria-activedescendant":isOpen?ariaActiveDescendant:"","aria-controls":isOpen?optionsListId:"","aria-expanded":isOpen}),optionsListElm=_react.default.createElement(_OptionsList.OptionsList,{name:name,isOpen:isOpen,isVirtualized:!1,options:options,triggerRef:triggerRef,onCloseDropdown:closeOptionsList,portalContainer:portalContainer,selectedIndex:selectedIndex,onSelectedIndexChange:handleSelectedIndexChange,forceChangeFakeSelect:handleChange,value:value,disabled:disabled,maxHeight:maxHeight,optionsListWidth:optionsListWidth});return _react.default.createElement(_react.default.Fragment,null,triggerElm,optionsListElm,_react.default.createElement(HiddenSelectInput,{name:excludeFromFormData?void 0:name,onChange:onChange,value:value,ref:hiddenSelectRef,autoComplete:autoComplete},_react.default.createElement("option",{value:"","aria-label":"Empty option"}),options.map(option=>_react.default.createElement("option",{value:option.value,key:option.value},option.label))))}
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"SelectWithCustomTrigger",{enumerable:!0,get:function(){return SelectWithCustomTrigger}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/require("@swc/helpers/_/_interop_require_wildcard")._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_OptionsList=require("../Combobox/OptionsList"),_useKeyboard=require("../../../shared/useKeyboard"),_useTypeAheadSearch=require("./useTypeAheadSearch"),HiddenSelectInput=(0,_styled.default)("select",{target:"ejxvztk0",label:"HiddenSelectInput"})(()=>({display:"none"}));function SelectWithCustomTrigger({renderTrigger,optionsListWidth,options=[],name,value,portalContainer,disabled=!1,maxHeight=230,autoComplete="on",readOnly=!1,excludeFromFormData=!1,onChange}){let[isOpen,setIsOpen]=(0,_react.useState)(!1),[selectedIndex,setSelectedIndex]=(0,_react.useState)(-1),triggerRef=(0,_react.useRef)(null),hiddenSelectRef=(0,_react.useRef)(null),currentOptionIndex=(0,_react.useMemo)(()=>options.findIndex(option=>option.value===value),[options,value]),closeOptionsList=(0,_react.useCallback)(()=>{isOpen&&(setIsOpen(!1),setSelectedIndex(-1))},[isOpen]),openOptionsList=(0,_react.useCallback)(()=>{isOpen||readOnly||(setIsOpen(!0),triggerRef.current?.focus())},[isOpen,readOnly]),toggleOptionsList=(0,_react.useCallback)(()=>{isOpen?closeOptionsList():openOptionsList()},[isOpen,openOptionsList,closeOptionsList]),handleSelectedIndexChange=(0,_react.useCallback)(index=>setSelectedIndex(index),[]),handleChange=(0,_react.useCallback)(option=>{let hiddenSelect=hiddenSelectRef.current;hiddenSelect&&(hiddenSelect.value=option.value,hiddenSelect.dispatchEvent(new Event("change",{bubbles:!0})))},[hiddenSelectRef]),handleSearchMatch=(0,_react.useCallback)(matchedIndex=>{-1!==matchedIndex&&(isOpen?setSelectedIndex(matchedIndex):handleChange(options[matchedIndex]))},[isOpen,options,setSelectedIndex,handleChange]);(0,_useKeyboard.useKeyboard)({"Enter Space ArrowUp ArrowDown":()=>{openOptionsList()}},triggerRef,!isOpen&&!disabled),(0,_useTypeAheadSearch.useTypeAheadSearch)({options,triggerRef,isActive:!disabled,fromIndex:-1!==selectedIndex?selectedIndex:currentOptionIndex,onMatch:handleSearchMatch}),(0,_react.useEffect)(()=>{let triggerElm=triggerRef.current,handlePointerDown=evt=>{evt.preventDefault()};return triggerElm&&!disabled&&(triggerElm.setAttribute("tabIndex","0"),triggerElm.addEventListener("click",toggleOptionsList),triggerElm.addEventListener("blur",closeOptionsList),triggerElm.addEventListener("pointerdown",handlePointerDown)),()=>{triggerElm?.removeEventListener("click",toggleOptionsList),triggerElm?.removeEventListener("blur",closeOptionsList),triggerElm?.removeEventListener("pointerdown",handlePointerDown)}},[triggerRef,disabled,closeOptionsList,toggleOptionsList]),(0,_react.useEffect)(()=>{let triggerElm=triggerRef.current,handleEscapeKeyDown=evt=>{"Escape"===evt.code&&(evt.preventDefault(),evt.stopPropagation(),closeOptionsList())};return triggerElm&&isOpen&&triggerElm.addEventListener("keydown",handleEscapeKeyDown),()=>{triggerElm?.removeEventListener("keydown",handleEscapeKeyDown)}},[triggerRef,isOpen,closeOptionsList]);let optionsListId=(0,_OptionsList.getOptionsListId)(name),ariaActiveDescendant=-1!==selectedIndex?(0,_OptionsList.getOptionId)(name,options[selectedIndex].value):"",triggerElm=renderTrigger({triggerRef,isOpen,disabled,role:"combobox","aria-activedescendant":isOpen?ariaActiveDescendant:"","aria-controls":isOpen?optionsListId:"","aria-expanded":isOpen}),optionsListElm=_react.default.createElement(_OptionsList.OptionsList,{name:name,isOpen:isOpen,isVirtualized:!1,options:options,triggerRef:triggerRef,onCloseDropdown:closeOptionsList,portalContainer:portalContainer,selectedIndex:selectedIndex,onSelectedIndexChange:handleSelectedIndexChange,forceChangeFakeSelect:handleChange,value:value,disabled:disabled,maxHeight:maxHeight,optionsListWidth:optionsListWidth});return _react.default.createElement(_react.default.Fragment,null,triggerElm,optionsListElm,_react.default.createElement(HiddenSelectInput,{name:excludeFromFormData?void 0:name,onChange:onChange,value:value,ref:hiddenSelectRef,autoComplete:autoComplete},_react.default.createElement("option",{value:"","aria-label":"Empty option"}),options.map(option=>_react.default.createElement("option",{value:option.value,key:option.value},option.label))))}

package/build/cjs/components/Form/Select/useTypeAheadSearch.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"useTypeAheadSearch",{enumerable:!0,get:function(){return useTypeAheadSearch}});const _react=require("react"),_useWindow=require("../../../shared/useWindow");function useTypeAheadSearch({options,triggerRef,isActive,fromIndex,onMatch}){let queryRef=(0,_react.useRef)(""),queryTimerRef=(0,_react.useRef)(null),window=(0,_useWindow.useWindow)(),selectOptionFromQuery=(0,_react.useCallback)(()=>{if(queryRef.current){let query=queryRef.current.toLowerCase(),labels=options.map(option=>option.label.slice(0,queryRef.current.length).toLowerCase()),matchedIndex=labels.indexOf(query,fromIndex+1);-1===matchedIndex&&(matchedIndex=labels.indexOf(query)),onMatch(matchedIndex,queryRef.current),queryRef.current=""}},[options,queryRef,fromIndex,onMatch]),handleKeyDown=(0,_react.useCallback)(evt=>{window.clearTimeout(queryTimerRef.current),evt.key.match(/^(\w|\s)$/g)&&(queryRef.current+=evt.key),queryTimerRef.current=window.setTimeout(selectOptionFromQuery,200)},[queryRef,queryTimerRef,selectOptionFromQuery,window]);(0,_react.useEffect)(()=>()=>{window.clearTimeout(queryTimerRef.current)},[window]),(0,_react.useEffect)(()=>{let triggerElm=triggerRef.current;return isActive&&triggerElm?.addEventListener("keydown",handleKeyDown),()=>{triggerElm?.removeEventListener("keydown",handleKeyDown)}},[triggerRef,isActive,handleKeyDown])}
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"useTypeAheadSearch",{enumerable:!0,get:function(){return useTypeAheadSearch}});const _react=require("react"),_useWindow=require("../../../shared/useWindow");function useTypeAheadSearch({options=[],triggerRef,isActive,fromIndex,onMatch}){let queryRef=(0,_react.useRef)(""),queryTimerRef=(0,_react.useRef)(void 0),window=(0,_useWindow.useWindow)(),selectOptionFromQuery=(0,_react.useCallback)(()=>{if(queryRef.current){let query=queryRef.current.toLowerCase(),labels=options.map(option=>option.label.slice(0,queryRef.current.length).toLowerCase()),matchedIndex=labels.indexOf(query,fromIndex+1);-1===matchedIndex&&(matchedIndex=labels.indexOf(query)),onMatch(matchedIndex,queryRef.current),queryRef.current=""}},[options,queryRef,fromIndex,onMatch]),handleKeyDown=(0,_react.useCallback)(evt=>{window.clearTimeout(queryTimerRef.current),evt.key.match(/^(\w|\s)$/g)&&(queryRef.current+=evt.key),queryTimerRef.current=window.setTimeout(selectOptionFromQuery,200)},[queryRef,queryTimerRef,selectOptionFromQuery,window]);(0,_react.useEffect)(()=>()=>{window.clearTimeout(queryTimerRef.current)},[window]),(0,_react.useEffect)(()=>{let triggerElm=triggerRef.current;return isActive&&triggerElm?.addEventListener("keydown",handleKeyDown),()=>{triggerElm?.removeEventListener("keydown",handleKeyDown)}},[triggerRef,isActive,handleKeyDown])}

package/build/cjs/components/Form/Textarea/Textarea.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var target=exports,all={get Textarea(){return Textarea},get TextareaRaw(){return TextareaRaw}};for(var name in all)Object.defineProperty(target,name,{enumerable:!0,get:Object.getOwnPropertyDescriptor(all,name).get});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/_interop_require_default._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_FormField=require("../FormField/FormField"),_useFormFieldMessageId=require("../FormField/useFormFieldMessageId"),StyledTextarea=(0,_styled.default)("textarea",{target:"e16qp1wc0",label:"StyledTextarea"})(({theme,resize,hasError})=>({fontFamily:theme.variables.fontFamily.lato,fontSize:theme.variables.size.font.m,lineHeight:theme.variables.size.lineHeight.xl,minHeight:theme.variables.size.dimension.textarea.minHeight.m,borderRadius:theme.variables.size.borderRadius.xs,border:"1px solid",width:"100%",padding:theme.variables.size.spacing.xs,boxSizing:"border-box",color:theme.values.color.text.primary.default,borderColor:hasError?theme.values.color.border.error.default:theme.values.color.border.primary.default,backgroundColor:theme.values.color.background.primary.default,...hasError&&{boxShadow:`0 0 0 1px inset ${theme.values.color.border.error.default}`},resize})),StyledContainer=(0,_styled.default)("div",{target:"e16qp1wc1",label:"StyledContainer"})(()=>({width:"100%",display:"flex",alignItems:"center",flexDirection:"row",position:"relative"})),TextareaRaw=_react.default.forwardRef(({autoComplete="on",rows=5,maxLength=256,resize="none",disabled,hasError,...rest},ref)=>_react.default.createElement(StyledContainer,null,_react.default.createElement(StyledTextarea,{...rest,ref:ref,hasError:hasError,autoComplete:autoComplete,disabled:disabled,rows:rows,maxLength:maxLength,resize:resize,"aria-invalid":hasError}))),Textarea=_react.default.forwardRef(({disabled,label,labelHint,hideLabel,hint,errorMessages,"aria-describedby":ariaDescribedBy,"data-e2e-test-id":dataE2eTestId,...rest},ref)=>{let{id,ariaDescribedByProp}=(0,_useFormFieldMessageId.useFormFieldMessageId)({ariaDescribedBy,errorMessages,hint});return _react.default.createElement(_FormField.FormField,{"data-e2e-test-id":dataE2eTestId,"data-ds-id":"Textarea",disabled:disabled,label:label,labelHint:labelHint,hideLabel:hideLabel,hint:hint,errorMessages:errorMessages,messageId:id},_react.default.createElement(TextareaRaw,{...rest,ref:ref,disabled:disabled,...ariaDescribedByProp}))});
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var target=exports,all={get Textarea(){return Textarea},get TextareaRaw(){return TextareaRaw}};for(var name in all)Object.defineProperty(target,name,{enumerable:!0,get:Object.getOwnPropertyDescriptor(all,name).get});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/_interop_require_default._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_FormField=require("../FormField/FormField"),_useFormFieldMessageId=require("../FormField/useFormFieldMessageId"),StyledTextarea=(0,_styled.default)("textarea",{target:"e1ibutd00",label:"StyledTextarea"})(({theme,resize,hasError})=>({fontFamily:theme.variables.fontFamily.lato,fontSize:theme.variables.size.font.m,lineHeight:theme.variables.size.lineHeight.xl,minHeight:theme.variables.size.dimension.textarea.minHeight.m,borderRadius:theme.variables.size.borderRadius.xs,border:"1px solid",width:"100%",padding:theme.variables.size.spacing.xs,boxSizing:"border-box",color:theme.values.color.text.primary.default,borderColor:hasError?theme.values.color.border.error.default:theme.values.color.border.primary.default,backgroundColor:theme.values.color.background.primary.default,...hasError&&{boxShadow:`0 0 0 1px inset ${theme.values.color.border.error.default}`},resize})),StyledContainer=(0,_styled.default)("div",{target:"e1ibutd01",label:"StyledContainer"})(()=>({width:"100%",display:"flex",alignItems:"center",flexDirection:"row",position:"relative"})),TextareaRaw=_react.default.forwardRef(({autoComplete="on",rows=5,maxLength=256,resize="none",disabled,hasError,...rest},ref)=>_react.default.createElement(StyledContainer,null,_react.default.createElement(StyledTextarea,{...rest,ref:ref,hasError:hasError,autoComplete:autoComplete,disabled:disabled,rows:rows,maxLength:maxLength,resize:resize,"aria-invalid":hasError}))),Textarea=_react.default.forwardRef(({disabled,label,labelHint,hideLabel,hint,errorMessages,"aria-describedby":ariaDescribedBy,"data-e2e-test-id":dataE2eTestId,...rest},ref)=>{let{id,ariaDescribedByProp}=(0,_useFormFieldMessageId.useFormFieldMessageId)({ariaDescribedBy,errorMessages,hint});return _react.default.createElement(_FormField.FormField,{"data-e2e-test-id":dataE2eTestId,"data-ds-id":"Textarea",disabled:disabled,label:label,labelHint:labelHint,hideLabel:hideLabel,hint:hint,errorMessages:errorMessages,messageId:id},_react.default.createElement(TextareaRaw,{...rest,ref:ref,disabled:disabled,...ariaDescribedByProp}))});

package/build/cjs/components/Form/Toggle/Toggle.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var target=exports,all={get Toggle(){return Toggle},get ToggleRaw(){return ToggleRaw}};for(var name in all)Object.defineProperty(target,name,{enumerable:!0,get:Object.getOwnPropertyDescriptor(all,name).get});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/_interop_require_default._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_FormField=require("../FormField/FormField"),_Inline=require("../../Inline/Inline"),_Text=require("../../Typography/Text/Text"),_useFormFieldMessageId=require("../FormField/useFormFieldMessageId"),StyledInputContainer=(0,_styled.default)("div",{target:"e68xb8t0",label:"StyledInputContainer"})(({theme,size})=>({display:"block",position:"relative",width:theme.variables.size.dimension.toggle.width[size],height:theme.variables.size.dimension.togglePoint[size],boxSizing:"border-box",cursor:"pointer"})),StyledRealInput=(0,_styled.default)("input",{target:"e68xb8t1",label:"StyledRealInput"})(({theme})=>({opacity:theme.variables.opacity.hidden,height:0,width:0,position:"absolute"})),StyledFakeInputInner=(0,_styled.default)("div",{target:"e68xb8t2",label:"StyledFakeInputInner"})(({theme,size})=>({width:theme.variables.size.dimension.togglePoint[size],height:theme.variables.size.dimension.togglePoint[size],margin:parseInt(theme.variables.size.dimension.togglePoint[size],10)/("m"===size?4:2),borderRadius:parseInt(theme.variables.size.dimension.togglePoint[size],10)/2,transform:"translateX(0)",transition:"transform 0.2s linear",backgroundColor:theme.values.color.toggle.thumb.background.off})),StyledFakeInput=(0,_styled.default)("div",{target:"e68xb8t3",label:"StyledFakeInput"})(({theme,size,isHighlighted})=>{let pointMargin=parseInt(theme.variables.size.dimension.togglePoint[size],10)/("m"===size?5:2.5),pointTranslateX=parseInt(theme.variables.size.dimension.toggle.width[size],10)-parseInt(theme.variables.size.dimension.togglePoint[size],10)-2*pointMargin-2;return{boxSizing:"border-box",width:theme.variables.size.dimension.toggle.width[size],height:theme.variables.size.dimension.toggle.height[size],borderRadius:({s:theme.variables.size.borderRadius.s,m:theme.variables.size.borderRadius.l})[size],display:"flex",alignItems:"center",transition:"background-color 0.2s linear, border-color 0.2s linear",background:isHighlighted?theme.values.color.toggle.background.highlight:theme.values.color.toggle.background.default,..."s"===size&&{marginTop:2},"input:checked + &":{background:theme.values.color.background.accent.default,[`${StyledFakeInputInner}`]:{transform:`translateX(${pointTranslateX}px)`,backgroundColor:theme.values.color.toggle.thumb.background.on}},"input:focus-visible + &":{outlineWidth:2,outlineStyle:"solid",outlineColor:"Highlight"},"@media (-webkit-min-device-pixel-ratio: 0)":{"input:focus-visible + &":{outlineColor:"-webkit-focus-ring-color",outlineStyle:"auto"}}}}),StyledContainer=(0,_styled.default)("div",{target:"e68xb8t4",label:"StyledContainer"})(()=>({"&:hover":{cursor:"pointer"}})),ToggleRaw=_react.default.forwardRef(({size="m",isHighlighted=!1,disabled,...rest},ref)=>_react.default.createElement(StyledInputContainer,{size:size},_react.default.createElement(StyledRealInput,{...rest,ref:ref,type:"checkbox",disabled:disabled}),_react.default.createElement(StyledFakeInput,{size:size,isHighlighted:isHighlighted},_react.default.createElement(StyledFakeInputInner,{size:size})))),Toggle=_react.default.forwardRef(({label="",alignLabel="before",labelHint="",disabled=!1,alignItems="left",size="m",hint,errorMessages,"aria-describedby":ariaDescribedBy,"data-e2e-test-id":dataE2eTestId,...rest},ref)=>{let{id,ariaDescribedByProp}=(0,_useFormFieldMessageId.useFormFieldMessageId)({ariaDescribedBy,errorMessages,hint}),labelColor="s"===size?"tertiary":"primary",labelWeight="s"===size?"bold":"normal",labelGroup=_react.default.createElement("div",null,_react.default.createElement(_Text.Text,{size:size,color:labelColor,weight:labelWeight},label),_react.default.createElement(_Text.Text,{size:"s",color:"tertiary"},labelHint));return _react.default.createElement(_FormField.FormField,{"data-e2e-test-id":dataE2eTestId,"data-ds-id":"Toggle",disabled:disabled,hint:hint,errorMessages:errorMessages,messageId:id},_react.default.createElement(StyledContainer,null,_react.default.createElement(_Inline.Inline,{alignItems:alignItems,space:"xs",vAlignItems:"top",noWrap:!0},label&&"before"===alignLabel&&labelGroup,_react.default.createElement(ToggleRaw,{...rest,ref:ref,size:size,disabled:disabled,...ariaDescribedByProp}),label&&"after"===alignLabel&&labelGroup)))});
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var target=exports,all={get Toggle(){return Toggle},get ToggleRaw(){return ToggleRaw}};for(var name in all)Object.defineProperty(target,name,{enumerable:!0,get:Object.getOwnPropertyDescriptor(all,name).get});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/_interop_require_default._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_FormField=require("../FormField/FormField"),_Inline=require("../../Inline/Inline"),_Text=require("../../Typography/Text/Text"),_useFormFieldMessageId=require("../FormField/useFormFieldMessageId"),StyledInputContainer=(0,_styled.default)("div",{target:"e1cpa63k0",label:"StyledInputContainer"})(({theme,size="m"})=>({display:"block",position:"relative",width:theme.variables.size.dimension.toggle.width[size],height:theme.variables.size.dimension.togglePoint[size],boxSizing:"border-box",cursor:"pointer"})),StyledRealInput=(0,_styled.default)("input",{target:"e1cpa63k1",label:"StyledRealInput"})(({theme})=>({opacity:theme.variables.opacity.hidden,height:0,width:0,position:"absolute"})),StyledFakeInputInner=(0,_styled.default)("div",{target:"e1cpa63k2",label:"StyledFakeInputInner"})(({theme,size="m"})=>({width:theme.variables.size.dimension.togglePoint[size],height:theme.variables.size.dimension.togglePoint[size],margin:parseInt(theme.variables.size.dimension.togglePoint[size],10)/("m"===size?4:2),borderRadius:parseInt(theme.variables.size.dimension.togglePoint[size],10)/2,transform:"translateX(0)",transition:"transform 0.2s linear",backgroundColor:theme.values.color.toggle.thumb.background.off})),StyledFakeInput=(0,_styled.default)("div",{target:"e1cpa63k3",label:"StyledFakeInput"})(({theme,size="m",isHighlighted})=>{let pointMargin=parseInt(theme.variables.size.dimension.togglePoint[size],10)/("m"===size?5:2.5),pointTranslateX=parseInt(theme.variables.size.dimension.toggle.width[size],10)-parseInt(theme.variables.size.dimension.togglePoint[size],10)-2*pointMargin-2;return{boxSizing:"border-box",width:theme.variables.size.dimension.toggle.width[size],height:theme.variables.size.dimension.toggle.height[size],borderRadius:({s:theme.variables.size.borderRadius.s,m:theme.variables.size.borderRadius.l})[size],display:"flex",alignItems:"center",transition:"background-color 0.2s linear, border-color 0.2s linear",background:isHighlighted?theme.values.color.toggle.background.highlight:theme.values.color.toggle.background.default,..."s"===size&&{marginTop:2},"input:checked + &":{background:theme.values.color.background.accent.default,[`${StyledFakeInputInner}`]:{transform:`translateX(${pointTranslateX}px)`,backgroundColor:theme.values.color.toggle.thumb.background.on}},"input:focus-visible + &":{outlineWidth:2,outlineStyle:"solid",outlineColor:"Highlight"},"@media (-webkit-min-device-pixel-ratio: 0)":{"input:focus-visible + &":{outlineColor:"-webkit-focus-ring-color",outlineStyle:"auto"}}}}),StyledContainer=(0,_styled.default)("div",{target:"e1cpa63k4",label:"StyledContainer"})(()=>({"&:hover":{cursor:"pointer"}})),ToggleRaw=_react.default.forwardRef(({size="m",isHighlighted=!1,disabled,...rest},ref)=>_react.default.createElement(StyledInputContainer,{size:size},_react.default.createElement(StyledRealInput,{...rest,ref:ref,type:"checkbox",disabled:disabled}),_react.default.createElement(StyledFakeInput,{size:size,isHighlighted:isHighlighted},_react.default.createElement(StyledFakeInputInner,{size:size})))),Toggle=_react.default.forwardRef(({label="",alignLabel="before",labelHint="",disabled=!1,alignItems="left",size="m",hint,errorMessages,"aria-describedby":ariaDescribedBy,"data-e2e-test-id":dataE2eTestId,...rest},ref)=>{let{id,ariaDescribedByProp}=(0,_useFormFieldMessageId.useFormFieldMessageId)({ariaDescribedBy,errorMessages,hint}),labelColor="s"===size?"tertiary":"primary",labelWeight="s"===size?"bold":"normal",labelGroup=_react.default.createElement("div",null,_react.default.createElement(_Text.Text,{size:size,color:labelColor,weight:labelWeight},label),_react.default.createElement(_Text.Text,{size:"s",color:"tertiary"},labelHint));return _react.default.createElement(_FormField.FormField,{"data-e2e-test-id":dataE2eTestId,"data-ds-id":"Toggle",disabled:disabled,hint:hint,errorMessages:errorMessages,messageId:id},_react.default.createElement(StyledContainer,null,_react.default.createElement(_Inline.Inline,{alignItems:alignItems,space:"xs",vAlignItems:"top",noWrap:!0},label&&"before"===alignLabel&&labelGroup,_react.default.createElement(ToggleRaw,{...rest,ref:ref,size:size,disabled:disabled,...ariaDescribedByProp}),label&&"after"===alignLabel&&labelGroup)))});

package/build/cjs/components/Form/ToggleButton/ToggleButton.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"ToggleButton",{enumerable:!0,get:function(){return ToggleButton}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/_interop_require_default._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_FormField=require("../FormField/FormField"),_Inline=require("../../Inline/Inline"),StyledContainer=(0,_styled.default)("div",{target:"e1ts6g770",label:"StyledContainer"})(()=>({display:"inline-block"})),StyledRealInput=(0,_styled.default)("input",{target:"e1ts6g771",label:"StyledRealInput"})(({theme})=>({opacity:theme.variables.opacity.hidden,cursor:"pointer",height:0,width:0,position:"absolute"})),StyledFakeInput=(0,_styled.default)("div",{target:"e1ts6g772",label:"StyledFakeInput"})(({theme})=>({boxSizing:"border-box",borderRadius:theme.variables.size.borderRadius.l,border:"2px solid",height:theme.variables.size.dimension.toggleButton.height.m,cursor:"pointer",display:"flex",alignItems:"center",justifyContent:"center",padding:`${theme.variables.size.spacing.zero} ${theme.variables.size.spacing.m}`,fontFamily:theme.variables.fontFamily.lato,fontSize:theme.variables.size.font.s,fontWeight:theme.variables.weight.bold,lineHeight:theme.variables.size.lineHeight.xs,backgroundColor:theme.values.color.background.transparent.default,borderColor:theme.values.color.border.secondary.default,color:theme.values.color.text.secondary.default,"&:hover":{borderColor:theme.values.color.border.secondary.hover},"&:active":{borderColor:theme.values.color.border.secondary.active},"input: focus-visible + &":{outlineWidth:"2px",outlineStyle:"solid",outlineColor:"Highlight"},"@media (-webkit-min-device-pixel-ratio:0)":{"input: focus-visible + &":{outlineColor:"-webkit-focus-ring-color",outlineStyle:"auto"}},"input:checked + &":{borderColor:theme.values.color.background.transparent.selected,background:theme.values.color.background.transparent.selected,color:theme.values.color.text.onAccent.default,"&:hover":{borderColor:theme.values.color.background.transparent.selectedHover,background:theme.values.color.background.transparent.selectedHover}}})),StyledSubLabel=(0,_styled.default)("div",{target:"e1ts6g773",label:"StyledSubLabel"})(({theme})=>({color:theme.values.color.text.tertiary.default,"input:checked + div &":{color:theme.values.color.text.onAccent.default}})),ToggleButton=_react.default.forwardRef(({label,subLabel,disabled=!1,"data-e2e-test-id":dataE2eTestId,...rest},ref)=>_react.default.createElement(_FormField.FormField,{"data-e2e-test-id":dataE2eTestId,"data-ds-id":"ToggleButton",disabled:disabled},_react.default.createElement(StyledContainer,{"data-e2e-test-id":dataE2eTestId},_react.default.createElement(StyledRealInput,{...rest,ref:ref,type:"checkbox",disabled:disabled}),_react.default.createElement(StyledFakeInput,null,_react.default.createElement(_Inline.Inline,{space:"xxs",noWrap:!0},label,subLabel&&_react.default.createElement(StyledSubLabel,null,subLabel))))));
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"ToggleButton",{enumerable:!0,get:function(){return ToggleButton}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/_interop_require_default._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_FormField=require("../FormField/FormField"),_Inline=require("../../Inline/Inline"),StyledContainer=(0,_styled.default)("div",{target:"e1yj37sd0",label:"StyledContainer"})(()=>({display:"inline-block"})),StyledRealInput=(0,_styled.default)("input",{target:"e1yj37sd1",label:"StyledRealInput"})(({theme})=>({opacity:theme.variables.opacity.hidden,cursor:"pointer",height:0,width:0,position:"absolute"})),StyledFakeInput=(0,_styled.default)("div",{target:"e1yj37sd2",label:"StyledFakeInput"})(({theme})=>({boxSizing:"border-box",borderRadius:theme.variables.size.borderRadius.l,border:"2px solid",height:theme.variables.size.dimension.toggleButton.height.m,cursor:"pointer",display:"flex",alignItems:"center",justifyContent:"center",padding:`${theme.variables.size.spacing.zero} ${theme.variables.size.spacing.m}`,fontFamily:theme.variables.fontFamily.lato,fontSize:theme.variables.size.font.s,fontWeight:theme.variables.weight.bold,lineHeight:theme.variables.size.lineHeight.xs,backgroundColor:theme.values.color.background.transparent.default,borderColor:theme.values.color.border.secondary.default,color:theme.values.color.text.secondary.default,"&:hover":{borderColor:theme.values.color.border.secondary.hover},"&:active":{borderColor:theme.values.color.border.secondary.active},"input: focus-visible + &":{outlineWidth:"2px",outlineStyle:"solid",outlineColor:"Highlight"},"@media (-webkit-min-device-pixel-ratio:0)":{"input: focus-visible + &":{outlineColor:"-webkit-focus-ring-color",outlineStyle:"auto"}},"input:checked + &":{borderColor:theme.values.color.background.transparent.selected,background:theme.values.color.background.transparent.selected,color:theme.values.color.text.onAccent.default,"&:hover":{borderColor:theme.values.color.background.transparent.selectedHover,background:theme.values.color.background.transparent.selectedHover}}})),StyledSubLabel=(0,_styled.default)("div",{target:"e1yj37sd3",label:"StyledSubLabel"})(({theme})=>({color:theme.values.color.text.tertiary.default,"input:checked + div &":{color:theme.values.color.text.onAccent.default}})),ToggleButton=_react.default.forwardRef(({label,subLabel,disabled=!1,"data-e2e-test-id":dataE2eTestId,...rest},ref)=>_react.default.createElement(_FormField.FormField,{"data-e2e-test-id":dataE2eTestId,"data-ds-id":"ToggleButton",disabled:disabled},_react.default.createElement(StyledContainer,{"data-e2e-test-id":dataE2eTestId},_react.default.createElement(StyledRealInput,{...rest,ref:ref,type:"checkbox",disabled:disabled}),_react.default.createElement(StyledFakeInput,null,_react.default.createElement(_Inline.Inline,{space:"xxs",noWrap:!0},label,subLabel&&_react.default.createElement(StyledSubLabel,null,subLabel))))));

package/build/cjs/components/Grid/Grid.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"Grid",{enumerable:!0,get:function(){return Grid}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/_interop_require_default._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_mediaQueries=require("../../shared/mediaQueries"),_GridItem=require("./GridItem"),StyledContainer=(0,_styled.default)("div",{target:"epsmnci0",label:"StyledContainer"})(({theme,templateColumns,templateRows,autoRows,templateAreas,inline,columnGap,alignItems,justifyItems,isSubgrid})=>{function getTrackSize(size){return`calc((100% - 11 * ${theme.variables.size.spacing[size]}) / 12)`}return{width:"100%",display:inline?"inline-grid":"grid",gridAutoFlow:"row",...(0,_mediaQueries.useResponsiveValue)({gridTemplateColumns:templateColumns||(isSubgrid?"subgrid":Array.isArray(columnGap)?columnGap.map(value=>`repeat(12, ${getTrackSize(value)})`):`repeat(12, ${getTrackSize(columnGap)})`),gridTemplateRows:templateRows,gridAutoRows:autoRows,gridTemplateAreas:templateAreas,alignItems,justifyItems})}},({theme,columnGap,rowGap})=>(0,_mediaQueries.useResponsiveStyles)({gridColumnGap:[columnGap,theme.variables.size.spacing],gridRowGap:[rowGap,theme.variables.size.spacing]}));function Grid({columnGap="m",rowGap="m","data-e2e-test-id":dataE2eTestId,children,...rest}){return _react.default.createElement(StyledContainer,{"data-e2e-test-id":dataE2eTestId,"data-ds-id":"Grid",columnGap:columnGap,rowGap:rowGap,...rest},children)}Grid.Item=_GridItem.GridItem;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"Grid",{enumerable:!0,get:function(){return Grid}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/_interop_require_default._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_mediaQueries=require("../../shared/mediaQueries"),_GridItem=require("./GridItem"),StyledContainer=(0,_styled.default)("div",{target:"e1l758so0",label:"StyledContainer"})(({theme,templateColumns,templateRows,autoRows,templateAreas,inline,columnGap,alignItems,justifyItems,isSubgrid})=>{function getTrackSize(size){return`calc((100% - 11 * ${theme.variables.size.spacing[size??"zero"]}) / 12)`}return{width:"100%",display:inline?"inline-grid":"grid",gridAutoFlow:"row",...(0,_mediaQueries.useResponsiveValue)({gridTemplateColumns:templateColumns||(isSubgrid?"subgrid":Array.isArray(columnGap)?columnGap.map(value=>`repeat(12, ${getTrackSize(value)})`):`repeat(12, ${getTrackSize(columnGap)})`),gridTemplateRows:templateRows,gridAutoRows:autoRows,gridTemplateAreas:templateAreas,alignItems,justifyItems})}},({theme,columnGap,rowGap})=>(0,_mediaQueries.useResponsiveStyles)({gridColumnGap:[columnGap,theme.variables.size.spacing],gridRowGap:[rowGap,theme.variables.size.spacing]}));function Grid({columnGap="m",rowGap="m","data-e2e-test-id":dataE2eTestId,children,...rest}){return _react.default.createElement(StyledContainer,{"data-e2e-test-id":dataE2eTestId,"data-ds-id":"Grid",columnGap:columnGap,rowGap:rowGap,...rest},children)}Grid.Item=_GridItem.GridItem;

package/build/cjs/components/Icon/Icon.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"Icon",{enumerable:!0,get:function(){return Icon}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/_interop_require_default._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_ispropvalid=/*#__PURE__*/_interop_require_default._(require("@emotion/is-prop-valid")),_iconsjson=/*#__PURE__*/_interop_require_default._(require("../../web-tokens/assets/icons.json")),_icons16json=/*#__PURE__*/_interop_require_default._(require("../../web-tokens/assets/icons16.json")),_useHover=require("../../shared/useHover"),_mediaQueries=require("../../shared/mediaQueries"),hasIcon16=name=>name in _icons16json.default,handleColor=(theme,color)=>"inherit"===color?"inherit":theme.values.color.icon[color].default,handleVariant=(theme,variant)=>{switch(variant){case"inherit":return"inherit";case"primary":return theme.values.color.icon.accent.default;case"secondary":return theme.values.color.icon.primary.default;default:return theme.values.color.icon[variant].default}},StyledIcon=(0,_styled.default)("div",{shouldForwardProp:prop=>(0,_ispropvalid.default)(prop)&&"color"!==prop,target:"e3zhdes0",label:"StyledIcon"})(({theme,variant,isHoverable,parentRef,parentIsHovered,size,as,color})=>({...(0,_mediaQueries.useResponsiveStyles)({width:[size,theme.variables.size.dimension.icon],height:[size,theme.variables.size.dimension.icon]}),"& > svg":{...(0,_mediaQueries.useResponsiveStyles)({width:[size,theme.variables.size.dimension.icon],height:[size,theme.variables.size.dimension.icon]})},color:variant?handleVariant(theme,variant):handleColor(theme,color),..."span"===as&&{verticalAlign:"middle"},...(parentIsHovered||isHoverable)&&{cursor:"pointer"},...parentRef&&{opacity:parentIsHovered?1:.6},...isHoverable&&{opacity:theme.variables.opacity.hover,":hover":{opacity:theme.variables.opacity.visible}}})),Icon=props=>{let{name,hoverable=!1,inline=!1,size="m",color="inherit",variant,"data-e2e-test-id":dataE2eTestId,"data-testid":dataTestId,"aria-label":ariaLabel,"aria-labelledby":ariaLabelledBy,role,...rest}=props,isHoverable="boolean"==typeof hoverable&&hoverable,parentRef="boolean"!=typeof hoverable&&hoverable,parentIsHovered=(0,_useHover.useHover)(parentRef),hasAccessibleName=!!(ariaLabel||ariaLabelledBy);return _react.default.createElement(StyledIcon,{as:inline?"span":"div","data-e2e-test-id":dataE2eTestId,"data-testid":dataTestId,"data-ds-id":"Icon","data-variant":color,variant:variant,color:color,isHoverable:isHoverable,parentRef:parentRef,parentIsHovered:parentIsHovered,size:size,dangerouslySetInnerHTML:{__html:"s"===size&&hasIcon16(name)?_icons16json.default[name]:_iconsjson.default[name]},...rest,"aria-hidden":hasAccessibleName?void 0:"true",role:role,"aria-label":ariaLabel,"aria-labelledby":ariaLabelledBy})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"Icon",{enumerable:!0,get:function(){return Icon}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/_interop_require_default._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_ispropvalid=/*#__PURE__*/_interop_require_default._(require("@emotion/is-prop-valid")),_iconsjson=/*#__PURE__*/_interop_require_default._(require("../../web-tokens/assets/icons.json")),_icons16json=/*#__PURE__*/_interop_require_default._(require("../../web-tokens/assets/icons16.json")),_useHover=require("../../shared/useHover"),_mediaQueries=require("../../shared/mediaQueries"),hasIcon16=name=>name in _icons16json.default,handleColor=(theme,color)=>"inherit"===color?"inherit":theme.values.color.icon[color].default,handleVariant=(theme,variant)=>{switch(variant){case"inherit":return"inherit";case"primary":return theme.values.color.icon.accent.default;case"secondary":return theme.values.color.icon.primary.default;default:return theme.values.color.icon[variant].default}},StyledIcon=(0,_styled.default)("div",{shouldForwardProp:prop=>(0,_ispropvalid.default)(prop)&&"color"!==prop,target:"eeidl2r0",label:"StyledIcon"})(({theme,variant,isHoverable,parentRef,parentIsHovered,size,as,color="inherit"})=>({...(0,_mediaQueries.useResponsiveStyles)({width:[size,theme.variables.size.dimension.icon],height:[size,theme.variables.size.dimension.icon]}),"& > svg":{...(0,_mediaQueries.useResponsiveStyles)({width:[size,theme.variables.size.dimension.icon],height:[size,theme.variables.size.dimension.icon]})},color:variant?handleVariant(theme,variant):handleColor(theme,color),..."span"===as&&{verticalAlign:"middle"},...(parentIsHovered||isHoverable)&&{cursor:"pointer"},...parentRef&&{opacity:parentIsHovered?1:.6},...isHoverable&&{opacity:theme.variables.opacity.hover,":hover":{opacity:theme.variables.opacity.visible}}})),Icon=props=>{let{name,hoverable=!1,inline=!1,size="m",color="inherit",variant,"data-e2e-test-id":dataE2eTestId,"data-testid":dataTestId,"aria-label":ariaLabel,"aria-labelledby":ariaLabelledBy,role,...rest}=props,isHoverable="boolean"==typeof hoverable&&hoverable,parentRef="boolean"!=typeof hoverable&&hoverable,parentIsHovered=(0,_useHover.useHover)(parentRef),hasAccessibleName=!!(ariaLabel||ariaLabelledBy);return _react.default.createElement(StyledIcon,{as:inline?"span":"div","data-e2e-test-id":dataE2eTestId,"data-testid":dataTestId,"data-ds-id":"Icon","data-variant":color,variant:variant,color:color,isHoverable:isHoverable,parentRef:parentRef,parentIsHovered:parentIsHovered,size:size,dangerouslySetInnerHTML:{__html:"s"===size&&hasIcon16(name)?_icons16json.default[name]:_iconsjson.default[name]},...rest,"aria-hidden":hasAccessibleName?void 0:"true",role:role,"aria-label":ariaLabel,"aria-labelledby":ariaLabelledBy})};

package/build/cjs/components/Image/Image.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"Image",{enumerable:!0,get:function(){return Image}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/require("@swc/helpers/_/_interop_require_wildcard")._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_mediaQueries=require("../../shared/mediaQueries"),_types=require("../../types"),StyledImg=(0,_styled.default)("img",{target:"e19rs9970",label:"StyledImg"})(({theme,borderRadius})=>(0,_mediaQueries.useResponsiveStyles)({borderRadius:[borderRadius,theme.variables.size.borderRadius]}),({fit,position})=>(0,_mediaQueries.useResponsiveValue)({objectFit:fit,objectPosition:position})),Image=(0,_react.forwardRef)((props,ref)=>{let{placeholderSrc,fallbackSrc,sources=[],lazy=!1,"data-e2e-test-id":dataE2eTestId,src,fit,position,borderRadius,onError,isDecorative,alt,...rest}=(0,_types.asValidProps)(props),[imgSrc,setImgSrc]=(0,_react.useState)(placeholderSrc||src),sourceElms=sources.map(sourceProps=>_react.default.createElement("source",sourceProps));(0,_react.useEffect)(()=>{if(placeholderSrc){let img=new window.Image;img.src=src,img.onload=()=>{setImgSrc(src)}}else setImgSrc(src)},[placeholderSrc,src]);let imgProps={...rest,...lazy&&{loading:"lazy"},alt:isDecorative?"":alt,fit,position,borderRadius};return _react.default.createElement("picture",{"data-e2e-test-id":dataE2eTestId,"data-ds-id":"Image"},sourceElms,_react.default.createElement(StyledImg,{...imgProps,src:imgSrc,onError:args=>{fallbackSrc&&setImgSrc(fallbackSrc),onError&&onError(args)},ref:ref}))});
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"Image",{enumerable:!0,get:function(){return Image}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/require("@swc/helpers/_/_interop_require_wildcard")._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_mediaQueries=require("../../shared/mediaQueries"),_types=require("../../types"),StyledImg=(0,_styled.default)("img",{target:"e7j7om30",label:"StyledImg"})(({theme,borderRadius})=>(0,_mediaQueries.useResponsiveStyles)({borderRadius:[borderRadius,theme.variables.size.borderRadius]}),({fit,position})=>(0,_mediaQueries.useResponsiveValue)({objectFit:fit,objectPosition:position})),Image=(0,_react.forwardRef)((props,ref)=>{let{placeholderSrc,fallbackSrc,sources=[],lazy=!1,"data-e2e-test-id":dataE2eTestId,src,fit,position,borderRadius,onError,isDecorative,alt,...rest}=(0,_types.asValidProps)(props),[imgSrc,setImgSrc]=(0,_react.useState)(placeholderSrc||src),sourceElms=sources.map(sourceProps=>_react.default.createElement("source",sourceProps));(0,_react.useEffect)(()=>{if(placeholderSrc){if(void 0===src)return;let img=new window.Image;img.src=src,img.onload=()=>{setImgSrc(src)}}else setImgSrc(src)},[placeholderSrc,src]);let imgProps={...rest,...lazy&&{loading:"lazy"},alt:isDecorative?"":alt,fit,position,borderRadius};return _react.default.createElement("picture",{"data-e2e-test-id":dataE2eTestId,"data-ds-id":"Image"},sourceElms,_react.default.createElement(StyledImg,{...imgProps,src:imgSrc,onError:args=>{fallbackSrc&&setImgSrc(fallbackSrc),onError&&onError(args)},ref:ref}))});

package/build/cjs/components/Inline/Inline.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"Inline",{enumerable:!0,get:function(){return Inline}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/_interop_require_default._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_flattenChildren=require("../../shared/flattenChildren"),_mediaQueries=require("../../shared/mediaQueries"),InlineContainer=(0,_styled.default)("div",{target:"e1qcpg6h0",label:"InlineContainer"})(({alignItems,vAlignItems,space,vSpace,theme,noWrap,fullWidth,as})=>({...(0,_mediaQueries.useResponsiveStyles)({alignItems:[vAlignItems,{top:"flex-start",bottom:"flex-end",center:"center",stretch:"stretch"}],justifyContent:[alignItems,{left:"flex-start",right:"flex-end",center:"center",spaceBetween:"space-between"}],gap:[space,theme.variables.size.spacing],rowGap:[vSpace,theme.variables.size.spacing]}),display:"flex",flexDirection:"row",flexWrap:noWrap?"nowrap":"wrap",...fullWidth&&{width:"100%"},..."div"!==as&&{padding:0,margin:0,listStyle:"none"}})),StyledInlineItem=(0,_styled.default)("div",{target:"e1qcpg6h1",label:"StyledInlineItem"})(({as})=>({..."div"!==as&&{padding:0,margin:0,"> *":{listStyle:"initial"}}}));function Inline({id,children,alignItems="left",vAlignItems="top",space="xs",vSpace=space,noWrap=!1,fullWidth=!1,as="div",role,"data-e2e-test-id":dataE2eTestId,"data-ds-id":dataDsId="Inline",...ariaAttributes}){let isList="div"!==as,inlineItemAs=isList?"li":"div";return _react.default.createElement(InlineContainer,{id:id,"data-e2e-test-id":dataE2eTestId,"data-ds-id":dataDsId,alignItems:alignItems,vAlignItems:vAlignItems,space:space,vSpace:vSpace,noWrap:noWrap,fullWidth:fullWidth,as:as,role:role??(isList?"list":void 0),...ariaAttributes},_react.default.Children.map((0,_flattenChildren.flattenChildren)(children),child=>child&&_react.default.createElement(StyledInlineItem,{as:inlineItemAs},child)))}
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"Inline",{enumerable:!0,get:function(){return Inline}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/_interop_require_default._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_flattenChildren=require("../../shared/flattenChildren"),_mediaQueries=require("../../shared/mediaQueries"),InlineContainer=(0,_styled.default)("div",{target:"e1p3jkof0",label:"InlineContainer"})(({alignItems,vAlignItems,space,vSpace,theme,noWrap,fullWidth,as})=>({...(0,_mediaQueries.useResponsiveStyles)({alignItems:[vAlignItems,{top:"flex-start",bottom:"flex-end",center:"center",stretch:"stretch"}],justifyContent:[alignItems,{left:"flex-start",right:"flex-end",center:"center",spaceBetween:"space-between"}],gap:[space,theme.variables.size.spacing],rowGap:[vSpace,theme.variables.size.spacing]}),display:"flex",flexDirection:"row",flexWrap:noWrap?"nowrap":"wrap",...fullWidth&&{width:"100%"},..."div"!==as&&{padding:0,margin:0,listStyle:"none"}})),StyledInlineItem=(0,_styled.default)("div",{target:"e1p3jkof1",label:"StyledInlineItem"})(({as})=>({..."div"!==as&&{padding:0,margin:0,"> *":{listStyle:"initial"}}}));function Inline({id,children,alignItems="left",vAlignItems="top",space="xs",vSpace=space,noWrap=!1,fullWidth=!1,as="div",role,"data-e2e-test-id":dataE2eTestId,"data-ds-id":dataDsId="Inline",...ariaAttributes}){let isList="div"!==as,inlineItemAs=isList?"li":"div";return _react.default.createElement(InlineContainer,{id:id,"data-e2e-test-id":dataE2eTestId,"data-ds-id":dataDsId,alignItems:alignItems,vAlignItems:vAlignItems,space:space,vSpace:vSpace,noWrap:noWrap,fullWidth:fullWidth,as:as,role:role??(isList?"list":void 0),...ariaAttributes},_react.default.Children.map((0,_flattenChildren.flattenChildren)(children),child=>child&&_react.default.createElement(StyledInlineItem,{as:inlineItemAs},child)))}

package/build/cjs/components/Internal/BaseTag/BaseTag.d.ts

@@ -13,11 +13,15 @@ type ConditionalTagProps = {
 } | {
     isRemovable: true;
     onClear: (e: React.MouseEvent) => void;
+    /**
+     * Accessible name for the clear button.
+     * TODO(DS): make required — the button has no other name. See follow-up.
+     */
     clearBtnAriaLabel?: string;
 };
 export type TagProps = OriginalTagProps & ConditionalTagProps;
 type BaseTagProps = TagProps & {
     size?: BaseTagSize;
 };
-export declare function BaseTag({ label, colorVariant, isRemovable, onClear, clearBtnAriaLabel, size, "data-e2e-test-id": dataE2eTestId, ...ariaAttributes }: BaseTagProps): React.ReactElement;
+export declare function BaseTag(props: BaseTagProps): React.ReactElement;
 export {};

package/build/cjs/components/Internal/BaseTag/BaseTag.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var target=exports,all={get BaseTag(){return BaseTag},get MAX_TAG_WIDTH(){return MAX_TAG_WIDTH}};for(var name in all)Object.defineProperty(target,name,{enumerable:!0,get:Object.getOwnPropertyDescriptor(all,name).get});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/_interop_require_default._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_PictogramButton=require("../../PictogramButton/PictogramButton"),MAX_TAG_WIDTH=200,TagContainer=(0,_styled.default)("span",{target:"e1x33ib00",label:"TagContainer"})(({theme,colorVariant,isRemovable,size})=>({display:"inline-flex",alignItems:"center",maxWidth:`${MAX_TAG_WIDTH}px`,paddingLeft:theme.variables.size.spacing.xs,paddingRight:isRemovable?theme.variables.size.spacing.zero:theme.variables.size.spacing.xs,borderRadius:theme.variables.size.borderRadius.xs,backgroundColor:theme.values.color.tag.background[colorVariant],color:theme.values.color.tag.text[colorVariant],fontFamily:theme.variables.fontFamily.lato,fontSize:theme.variables.size.font.s,lineHeight:theme.variables.size.lineHeight.xs,..."s"===size&&{paddingLeft:theme.variables.size.spacing.xxs,paddingRight:theme.variables.size.spacing.xxs,fontSize:theme.variables.size.font.xs,lineHeight:theme.variables.size.lineHeight.m}})),TagLabel=(0,_styled.default)("span",{target:"e1x33ib01",label:"TagLabel"})(({size})=>({overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap",paddingTop:"3px",paddingBottom:"5px",..."s"===size&&{paddingTop:0,paddingBottom:0}})),ClearButton=(0,_styled.default)(_PictogramButton.PictogramButton,{target:"e1x33ib02",label:"ClearButton"})(({theme,colorVariant})=>({backgroundColor:theme.values.color.background.transparent.default,color:theme.values.color.tag.text[colorVariant],"&:hover":{color:theme.values.color.tag.text[colorVariant]}}));function BaseTag({label,colorVariant="gray",isRemovable=!1,onClear,clearBtnAriaLabel,size="m","data-e2e-test-id":dataE2eTestId,...ariaAttributes}){return _react.default.createElement(TagContainer,{"data-e2e-test-id":dataE2eTestId,"data-ds-id":"Tag",colorVariant:colorVariant,isRemovable:isRemovable,size:size,...ariaAttributes},_react.default.createElement(TagLabel,{size:size},label),isRemovable&&_react.default.createElement(ClearButton,{icon:"x",size:"xs","aria-label":clearBtnAriaLabel,onClick:onClear,colorVariant:colorVariant}))}
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var target=exports,all={get BaseTag(){return BaseTag},get MAX_TAG_WIDTH(){return MAX_TAG_WIDTH}};for(var name in all)Object.defineProperty(target,name,{enumerable:!0,get:Object.getOwnPropertyDescriptor(all,name).get});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/_interop_require_default._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_useIntl=require("../../../shared/intl/useIntl"),_PictogramButton=require("../../PictogramButton/PictogramButton"),MAX_TAG_WIDTH=200,TagContainer=(0,_styled.default)("span",{target:"e1axbonh0",label:"TagContainer"})(({theme,colorVariant,isRemovable,size})=>({display:"inline-flex",alignItems:"center",maxWidth:`${MAX_TAG_WIDTH}px`,paddingLeft:theme.variables.size.spacing.xs,paddingRight:isRemovable?theme.variables.size.spacing.zero:theme.variables.size.spacing.xs,borderRadius:theme.variables.size.borderRadius.xs,backgroundColor:theme.values.color.tag.background[colorVariant],color:theme.values.color.tag.text[colorVariant],fontFamily:theme.variables.fontFamily.lato,fontSize:theme.variables.size.font.s,lineHeight:theme.variables.size.lineHeight.xs,..."s"===size&&{paddingLeft:theme.variables.size.spacing.xxs,paddingRight:theme.variables.size.spacing.xxs,fontSize:theme.variables.size.font.xs,lineHeight:theme.variables.size.lineHeight.m}})),TagLabel=(0,_styled.default)("span",{target:"e1axbonh1",label:"TagLabel"})(({size})=>({overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap",paddingTop:"3px",paddingBottom:"5px",..."s"===size&&{paddingTop:0,paddingBottom:0}})),ClearButton=(0,_styled.default)(_PictogramButton.PictogramButton,{target:"e1axbonh2",label:"ClearButton"})(({theme,colorVariant})=>({backgroundColor:theme.values.color.background.transparent.default,color:theme.values.color.tag.text[colorVariant],"&:hover":{color:theme.values.color.tag.text[colorVariant]}}));function BaseTag(props){let{label,colorVariant="gray",isRemovable=!1,size="m","data-e2e-test-id":dataE2eTestId,...ariaAttributes}=props,{formatMessage}=(0,_useIntl.useIntl)();return _react.default.createElement(TagContainer,{"data-e2e-test-id":dataE2eTestId,"data-ds-id":"Tag",colorVariant:colorVariant,isRemovable:isRemovable,size:size,...ariaAttributes},_react.default.createElement(TagLabel,{size:size},label),props.isRemovable&&_react.default.createElement(ClearButton,{icon:"x",size:"xs","aria-label":props.clearBtnAriaLabel??formatMessage("Tag.RemoveButton.AriaLabel"),onClick:props.onClear,colorVariant:colorVariant}))}

package/build/cjs/components/Internal/Float/Float.d.ts

@@ -4,4 +4,4 @@ export type FloatProps = {
     /** The children to render inside the float. */
     children: React.ReactNode;
 } & ViewportPosition;
-export declare function Float({ positionX, positionY, children, }: FloatProps): React.ReactElement;
+export declare function Float(props: FloatProps): React.ReactElement;

package/build/cjs/components/Internal/Float/Float.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"Float",{enumerable:!0,get:function(){return Float}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/_interop_require_default._(require("react")),_react1=require("@emotion/react"),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_Portal=require("../../Portal/Portal"),_useFloatingPosition=require("../../Utilities/FloatingPosition/useFloatingPosition"),_useDocument=require("../../../shared/useDocument"),StyledContainer=(0,_styled.default)("div",{target:"e101b6xk0",label:"StyledContainer"})(({floatingStyles,isPositioned,bottomBarHeight})=>({...floatingStyles,visibility:isPositioned?"visible":"hidden",...bottomBarHeight&&{translate:`0 calc(-1 * ${bottomBarHeight})`}}));function Float({positionX,positionY,children}){let theme=(0,_react1.useTheme)(),document=(0,_useDocument.useDocument)(),{setFloating,floatingStyles,isPositioned}=(0,_useFloatingPosition.useFloatingPosition)({mode:"viewport",positionX,positionY,offset:parseInt(theme.variables.size.spacing.m,10)}),bottomBarHeight="bottom"===positionY?theme.variables.layout.bottomBar.height.default:void 0,portalContainer=document?document.querySelector(`.${_Portal.AMBOSS_DS_FLOAT_PORTAL}`):null;return _react.default.createElement(_Portal.Portal,{portalContainer:portalContainer},_react.default.createElement(StyledContainer,{"data-ds-id":"Float",ref:setFloating,floatingStyles:floatingStyles,isPositioned:isPositioned,bottomBarHeight:bottomBarHeight},children))}
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"Float",{enumerable:!0,get:function(){return Float}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/_interop_require_default._(require("react")),_react1=require("@emotion/react"),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_Portal=require("../../Portal/Portal"),_useFloatingPosition=require("../../Utilities/FloatingPosition/useFloatingPosition"),_useDocument=require("../../../shared/useDocument"),StyledContainer=(0,_styled.default)("div",{target:"e1gevmfu0",label:"StyledContainer"})(({floatingStyles,isPositioned,bottomBarHeight})=>({...floatingStyles,visibility:isPositioned?"visible":"hidden",...bottomBarHeight&&{translate:`0 calc(-1 * ${bottomBarHeight})`}}));function Float(props){let{children,...viewportPosition}=props,theme=(0,_react1.useTheme)(),document=(0,_useDocument.useDocument)(),{setFloating,floatingStyles,isPositioned}=(0,_useFloatingPosition.useFloatingPosition)({mode:"viewport",...viewportPosition,offset:parseInt(theme.variables.size.spacing.m,10)}),bottomBarHeight="bottom"===props.positionY?theme.variables.layout.bottomBar.height.default:void 0,portalContainer=document?document.querySelector(`.${_Portal.AMBOSS_DS_FLOAT_PORTAL}`):null;return _react.default.createElement(_Portal.Portal,{portalContainer:portalContainer},_react.default.createElement(StyledContainer,{"data-ds-id":"Float",ref:setFloating,floatingStyles:floatingStyles,isPositioned:isPositioned,bottomBarHeight:bottomBarHeight},children))}

package/build/cjs/components/Internal/PanelHeader/PanelHeader.d.ts

@@ -1,5 +1,6 @@
 import React from "react";
 import type { IconProps } from "../../Icon/Icon";
+import type { HeaderProps } from "../../Typography/Header/Header";
 /**
  * Title shown in the header, after `leftSlot`. Visual only — the owning
  * panel's accessible name comes from its `aria-label`.
@@ -8,6 +9,9 @@ export type PanelHeaderTitle = {
     /** Visible title label. Clamped, so a label that outruns the header
      *  truncates on one line rather than reflowing the panel body beneath it. */
     label: React.ReactNode;
+    /** Element the label renders as, to fit the page's heading outline. Styling
+     *  stays `H5`'s whatever the tag. Default `"h5"`. */
+    as?: HeaderProps["as"];
     /** Optional leading icon. Decorative — the visible label names it. */
     icon?: Omit<IconProps, "size" | "aria-label" | "aria-labelledby" | "role">;
     /** Show the title block. Default `true`. */

package/build/cjs/components/Internal/PanelHeader/PanelHeader.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"PanelHeader",{enumerable:!0,get:function(){return PanelHeader}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/_interop_require_default._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_TextClamped=require("../../../components/Typography/TextClamped/TextClamped"),_mixins=require("../../../shared/mixins"),_Box=require("../../Box/Box"),_Inline=require("../../Inline/Inline"),_Icon=require("../../Icon/Icon"),_Header=require("../../Typography/Header/Header"),StyledHeaderSurface=(0,_styled.default)("div",{target:"e1ck2tjp0",label:"StyledHeaderSurface"})(({theme})=>({backgroundColor:theme.values.color.background.primary.default})),StyledHeaderRow=(0,_styled.default)("div",{target:"e1ck2tjp1",label:"StyledHeaderRow"})({display:"flex",alignItems:"center",justifyContent:"space-between",width:"100%"}),StyledLeadingGroup=(0,_styled.default)("div",{target:"e1ck2tjp2",label:"StyledLeadingGroup"})(({theme,isContentFaded})=>({minWidth:0,overflow:"hidden",...(0,_mixins.getLeftPanelFadeStyles)({theme,isFaded:isContentFaded})})),StyledSlotContent=(0,_styled.default)("div",{target:"e1ck2tjp3",label:"StyledSlotContent"})({width:"max-content"}),StyledTrailingGroup=(0,_styled.default)("div",{target:"e1ck2tjp4",label:"StyledTrailingGroup"})({alignSelf:"flex-start",flexShrink:0});function PanelHeader({leftSlot,title,rightSlot,isContentFaded=!1,"data-e2e-test-id":dataE2eTestId}){let colorTitleItems="primary";return _react.default.createElement(StyledHeaderSurface,{"data-e2e-test-id":dataE2eTestId},_react.default.createElement(_Box.Box,{space:"s",vSpace:"xs"},_react.default.createElement(StyledHeaderRow,null,_react.default.createElement(StyledLeadingGroup,{isContentFaded:isContentFaded},_react.default.createElement(_Inline.Inline,{space:"xs",vAlignItems:"center",noWrap:!0},_react.default.createElement(_react.default.Fragment,null,leftSlot&&_react.default.createElement(StyledSlotContent,null,leftSlot),title&&!1!==title.isVisible&&_react.default.createElement(_Inline.Inline,{space:"xs",vAlignItems:"center",noWrap:!0},title.icon&&_react.default.createElement(_Icon.Icon,{...title.icon,color:colorTitleItems,size:"s"}),_react.default.createElement(_TextClamped.TextClamped,{as:"span"},_react.default.createElement(_Header.H5,{color:colorTitleItems},title.label)))))),_react.default.createElement(StyledTrailingGroup,null,_react.default.createElement(_Inline.Inline,{space:"xxs",vAlignItems:"center",noWrap:!0},_react.default.createElement(_react.default.Fragment,null,rightSlot))))))}
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"PanelHeader",{enumerable:!0,get:function(){return PanelHeader}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/_interop_require_default._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_TextClamped=require("../../../components/Typography/TextClamped/TextClamped"),_mixins=require("../../../shared/mixins"),_Box=require("../../Box/Box"),_Inline=require("../../Inline/Inline"),_Icon=require("../../Icon/Icon"),_Header=require("../../Typography/Header/Header"),StyledHeaderSurface=(0,_styled.default)("div",{target:"e11b515r0",label:"StyledHeaderSurface"})(({theme})=>({backgroundColor:theme.values.color.background.primary.default})),StyledHeaderRow=(0,_styled.default)("div",{target:"e11b515r1",label:"StyledHeaderRow"})({display:"flex",alignItems:"center",justifyContent:"space-between",width:"100%"}),StyledLeadingGroup=(0,_styled.default)("div",{target:"e11b515r2",label:"StyledLeadingGroup"})(({theme,isContentFaded})=>({minWidth:0,overflow:"hidden",...(0,_mixins.getLeftPanelFadeStyles)({theme,isFaded:isContentFaded})})),StyledSlotContent=(0,_styled.default)("div",{target:"e11b515r3",label:"StyledSlotContent"})({width:"max-content"}),StyledTrailingGroup=(0,_styled.default)("div",{target:"e11b515r4",label:"StyledTrailingGroup"})({alignSelf:"flex-start",flexShrink:0});function PanelHeader({leftSlot,title,rightSlot,isContentFaded=!1,"data-e2e-test-id":dataE2eTestId}){let colorTitleItems="primary";return _react.default.createElement(StyledHeaderSurface,{"data-e2e-test-id":dataE2eTestId},_react.default.createElement(_Box.Box,{space:"s",vSpace:"xs"},_react.default.createElement(StyledHeaderRow,null,_react.default.createElement(StyledLeadingGroup,{isContentFaded:isContentFaded},_react.default.createElement(_Inline.Inline,{space:"xs",vAlignItems:"center",noWrap:!0},_react.default.createElement(_react.default.Fragment,null,leftSlot&&_react.default.createElement(StyledSlotContent,null,leftSlot),title&&!1!==title.isVisible&&_react.default.createElement(_Inline.Inline,{space:"xs",vAlignItems:"center",noWrap:!0},title.icon&&_react.default.createElement(_Icon.Icon,{...title.icon,color:colorTitleItems,size:"s"}),_react.default.createElement(_TextClamped.TextClamped,{as:"span"},_react.default.createElement(_Header.H5,{as:title.as,color:colorTitleItems},title.label)))))),_react.default.createElement(StyledTrailingGroup,null,_react.default.createElement(_Inline.Inline,{space:"xxs",vAlignItems:"center",noWrap:!0},_react.default.createElement(_react.default.Fragment,null,rightSlot))))))}

package/build/cjs/components/Internal/Sandwich/useSandwichContext.d.ts

@@ -16,6 +16,6 @@ export type SandwichContextValue = SandwichEdges & {
     /** Static host below the scroll body - `Sandwich.Footer` portals into it. */
     footerSlotNode: HTMLElement | null;
 };
-export declare const SandwichProvider: React.Provider<SandwichContextValue>;
+export declare const SandwichProvider: React.Provider<SandwichContextValue | null>;
 /** Read the Sandwich context, or throw if used outside `<Sandwich>`. */
 export declare function useSandwichContext(): SandwichContextValue;

package/build/cjs/components/Layout/-constants.d.ts

@@ -19,6 +19,10 @@ export declare const PANEL_ORDER: readonly ["leftPanel", "content", "splitview",
 export type SlotKey = (typeof PANEL_ORDER)[number];
 export type SidePanelKey = (typeof SIDE_PANELS)[number];
 export type PanelKey = (typeof PANELS)[number];
+/** Presentation the left panel is in until the config or a `setVariant`
+ *  says otherwise. The store leaves `variant` unset until then, so every
+ *  reader resolves it against this. */
+export declare const DEFAULT_LEFT_PANEL_VARIANT = "sidebar";
 /** Everything but pinned `content`, which never competes for row space. */
 export type TogglableSlotKey = Exclude<SlotKey, typeof Slot.content>;
 /** Slots the app opens/closes, in `PANEL_ORDER`. */

package/build/cjs/components/Layout/-constants.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var target=exports,all={get BOTTOM_BAR_HEIGHT_VAR(){return BOTTOM_BAR_HEIGHT_VAR},get PAGE_BOTTOM_BAR_INSET(){return PAGE_BOTTOM_BAR_INSET},get PANELS(){return PANELS},get PANEL_ORDER(){return PANEL_ORDER},get PANEL_WIDTH_VAR(){return PANEL_WIDTH_VAR},get RIGHT_PANEL_BOTTOM_BAR_HEIGHT_VAR(){return RIGHT_PANEL_BOTTOM_BAR_HEIGHT_VAR},get RIGHT_PANEL_BOTTOM_BAR_INSET(){return RIGHT_PANEL_BOTTOM_BAR_INSET},get SIDE_PANELS(){return SIDE_PANELS},get SPLIT_MAX_WIDTH_VAR(){return SPLIT_MAX_WIDTH_VAR},get SUBNAV_OFFSET_VAR(){return SUBNAV_OFFSET_VAR},get Slot(){return Slot},get TOGGLABLE_SLOTS(){return TOGGLABLE_SLOTS}};for(var name in all)Object.defineProperty(target,name,{enumerable:!0,get:Object.getOwnPropertyDescriptor(all,name).get});const _layoutvars=require("../../web-tokens/layout-vars"),Slot={leftPanel:"leftPanel",content:"content",splitview:"splitview",rightPanel:"rightPanel"},SIDE_PANELS=[Slot.leftPanel,Slot.rightPanel],PANELS=[Slot.content,Slot.splitview],PANEL_ORDER=[Slot.leftPanel,Slot.content,Slot.splitview,Slot.rightPanel],TOGGLABLE_SLOTS=PANEL_ORDER.filter(slot=>slot!==Slot.content),SUBNAV_OFFSET_VAR=_layoutvars.LAYOUT_VARS.subnavOffset,SPLIT_MAX_WIDTH_VAR=_layoutvars.LAYOUT_VARS.splitMaxWidth,BOTTOM_BAR_HEIGHT_VAR=_layoutvars.LAYOUT_VARS.bottomBarHeight,RIGHT_PANEL_BOTTOM_BAR_HEIGHT_VAR=_layoutvars.LAYOUT_VARS.rightPanelBottomBarHeight,PAGE_BOTTOM_BAR_INSET=`var(${BOTTOM_BAR_HEIGHT_VAR}, 0px)`,RIGHT_PANEL_BOTTOM_BAR_INSET=`var(${RIGHT_PANEL_BOTTOM_BAR_HEIGHT_VAR}, ${PAGE_BOTTOM_BAR_INSET})`,PANEL_WIDTH_VAR={leftPanel:_layoutvars.LAYOUT_VARS.leftPanelWidth,content:_layoutvars.LAYOUT_VARS.contentWidth,rightPanel:_layoutvars.LAYOUT_VARS.rightPanelWidth};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var target=exports,all={get BOTTOM_BAR_HEIGHT_VAR(){return BOTTOM_BAR_HEIGHT_VAR},get DEFAULT_LEFT_PANEL_VARIANT(){return DEFAULT_LEFT_PANEL_VARIANT},get PAGE_BOTTOM_BAR_INSET(){return PAGE_BOTTOM_BAR_INSET},get PANELS(){return PANELS},get PANEL_ORDER(){return PANEL_ORDER},get PANEL_WIDTH_VAR(){return PANEL_WIDTH_VAR},get RIGHT_PANEL_BOTTOM_BAR_HEIGHT_VAR(){return RIGHT_PANEL_BOTTOM_BAR_HEIGHT_VAR},get RIGHT_PANEL_BOTTOM_BAR_INSET(){return RIGHT_PANEL_BOTTOM_BAR_INSET},get SIDE_PANELS(){return SIDE_PANELS},get SPLIT_MAX_WIDTH_VAR(){return SPLIT_MAX_WIDTH_VAR},get SUBNAV_OFFSET_VAR(){return SUBNAV_OFFSET_VAR},get Slot(){return Slot},get TOGGLABLE_SLOTS(){return TOGGLABLE_SLOTS}};for(var name in all)Object.defineProperty(target,name,{enumerable:!0,get:Object.getOwnPropertyDescriptor(all,name).get});const _layoutvars=require("../../web-tokens/layout-vars"),Slot={leftPanel:"leftPanel",content:"content",splitview:"splitview",rightPanel:"rightPanel"},SIDE_PANELS=[Slot.leftPanel,Slot.rightPanel],PANELS=[Slot.content,Slot.splitview],PANEL_ORDER=[Slot.leftPanel,Slot.content,Slot.splitview,Slot.rightPanel],DEFAULT_LEFT_PANEL_VARIANT="sidebar",TOGGLABLE_SLOTS=PANEL_ORDER.filter(slot=>slot!==Slot.content),SUBNAV_OFFSET_VAR=_layoutvars.LAYOUT_VARS.subnavOffset,SPLIT_MAX_WIDTH_VAR=_layoutvars.LAYOUT_VARS.splitMaxWidth,BOTTOM_BAR_HEIGHT_VAR=_layoutvars.LAYOUT_VARS.bottomBarHeight,RIGHT_PANEL_BOTTOM_BAR_HEIGHT_VAR=_layoutvars.LAYOUT_VARS.rightPanelBottomBarHeight,PAGE_BOTTOM_BAR_INSET=`var(${BOTTOM_BAR_HEIGHT_VAR}, 0px)`,RIGHT_PANEL_BOTTOM_BAR_INSET=`var(${RIGHT_PANEL_BOTTOM_BAR_HEIGHT_VAR}, ${PAGE_BOTTOM_BAR_INSET})`,PANEL_WIDTH_VAR={leftPanel:_layoutvars.LAYOUT_VARS.leftPanelWidth,content:_layoutvars.LAYOUT_VARS.contentWidth,rightPanel:_layoutvars.LAYOUT_VARS.rightPanelWidth};

package/build/cjs/components/Layout/-types.d.ts

@@ -103,15 +103,14 @@ export type LayoutState = {
 export type SidePanelConfig = {
     defaultVisible?: boolean;
     collapsible?: boolean;
-    /** Desktop only: allow drag-resizing the panel's column. Defaults `false` for
-     *  the left panel, `true` for the right. The panel's own `resizable` prop
-     *  overrides this. */
+    /** Desktop only: allow drag-resizing the panel's column. Default `true`. The
+     *  panel's own `resizable` prop overrides this. */
     resizable?: boolean;
     defaultSize?: Size;
     minSize?: Size;
     maxSize?: Size;
 };
-export type LeftPanelConfig = SidePanelConfig & {
+export type LeftPanelConfig = Omit<SidePanelConfig, "defaultSize" | "minSize" | "maxSize" | "resizable"> & {
     /** Presentation the panel starts in. Default `"sidebar"`. */
     variant?: LeftPanelVariant;
 };
@@ -300,8 +299,7 @@ export type SidePanelProps = ForwardedScrollProps & {
     minSize?: Size;
     maxSize?: Size;
     /** Desktop only: allow drag-resizing the panel's column. Overrides the
-     *  provider config's `resizable`, which defaults `false` for the left panel
-     *  and `true` for the right. When `false`, the column is fixed at
+     *  provider config's `resizable`. When `false`, the column is fixed at
      *  `defaultSize` - neighbours can't resize it either, though they stay
      *  resizable against each other. Showing and hiding the panel still works. No
      *  effect on the mobile drawer/sheet. */
@@ -309,28 +307,22 @@ export type SidePanelProps = ForwardedScrollProps & {
     /** Called whenever the panel's visibility changes, with the new value. */
     onVisibleChange?: (visible: boolean) => void;
 };
-export type LeftPanelProps = Omit<SidePanelProps, "defaultSize" | "minSize" | "maxSize"> & {
-    /** Pixels. Unlike the other panels the left panel takes no percentage: with a
-     *  left bar its content is pinned to this width and clipped as the column narrows,
-     *  and a percentage would resolve against the narrowing column instead of the
-     *  width it opens to - so the content would reflow mid-slide, which is the one
-     *  thing the pin exists to prevent.
-     *
-     *  Sets the column's starting width only: the docked panel keeps that width
-     *  when the window resizes, and `Layout.Content` grows and shrinks around it.
-     *  Drag-resizing is a separate story - see `resizable`. */
-    defaultSize?: number;
-    minSize?: number;
-    maxSize?: number;
+/** Props the left panel hands to the parts it renders itself. */
+export type LeftPanelSlotProps = {
+    toggleButton: {
+        /** Accessible name for the left bar's open button, which is icon-only. */
+        "aria-label": string;
+        "data-e2e-test-id"?: string;
+    };
+};
+/** No sizing or resizing props: the left panel always opens to the
+ *  `layout.leftPanel.width.open` token. */
+export type LeftPanelProps = Omit<SidePanelProps, "defaultSize" | "minSize" | "maxSize" | "resizable"> & {
     /** Props forwarded to the panel's internal parts. Required: the left bar
      *  always carries the button that opens the panel, and it is icon-only, so its
      *  accessible name can only come from here. Give it the action - the panel's
      *  own `aria-label` already names the region it opens. */
-    slotProps: {
-        toggleButton: {
-            "aria-label": string;
-        };
-    };
+    slotProps: LeftPanelSlotProps;
     /** Accessible name for the panel. Used to label the modal drawer it renders
      *  as on mobile (`role="dialog"`). Ignored by the docked desktop panel. */
     "aria-label": string;