@amboss/design-system 4.2.3-canary.0 → 4.2.4

package/build/cjs/shared/useAutoPosition.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"useAutoPosition",{enumerable:!0,get:function(){return useAutoPosition}});const _react=require("react"),_useIsomorphicLayoutEffect=require("./useIsomorphicLayoutEffect"),_useWindow=require("./useWindow"),_useDocument=require("./useDocument"),useAutoPosition=({anchorRef,contentRef,isActive,forceVerticalPosition})=>{let[verticalPosition,setVerticalPosition]=(0,_react.useState)("down"),[horizontalPosition,setHorizontalPosition]=(0,_react.useState)("left"),document=(0,_useDocument.useDocument)(),window=(0,_useWindow.useWindow)();return(0,_useIsomorphicLayoutEffect.useIsomorphicLayoutEffect)(()=>{if(contentRef)if(isActive){let maxHeight=Math.max(document.documentElement.clientHeight||0,window.innerHeight||0),rect=contentRef.current.getBoundingClientRect(),anchorHeight=anchorRef.current.getBoundingClientRect().height,anchorX=anchorRef.current.getBoundingClientRect().x,screenWidth=window.innerWidth,isUp=rect.top+rect.height>maxHeight,isDown=rect.top-anchorHeight<rect.height;forceVerticalPosition?setVerticalPosition(forceVerticalPosition):isUp?setVerticalPosition("up"):isDown&&setVerticalPosition("down"),anchorX>screenWidth/2?setHorizontalPosition("left"):anchorX<screenWidth/2&&setHorizontalPosition("right")}else setVerticalPosition("down"),setHorizontalPosition("left")},[anchorRef,contentRef,document.documentElement.clientHeight,isActive,window.innerHeight,window.innerWidth,forceVerticalPosition]),[verticalPosition,horizontalPosition]};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"useAutoPosition",{enumerable:!0,get:function(){return useAutoPosition}});const _react=require("react"),_useWindow=require("./useWindow"),_useDocument=require("./useDocument"),useAutoPosition=({anchorRef,contentRef,isActive,forceVerticalPosition})=>{let[verticalPosition,setVerticalPosition]=(0,_react.useState)("down"),[horizontalPosition,setHorizontalPosition]=(0,_react.useState)("left"),document=(0,_useDocument.useDocument)(),window=(0,_useWindow.useWindow)();return(0,_react.useLayoutEffect)(()=>{if(contentRef)if(isActive){let maxHeight=Math.max(document.documentElement.clientHeight||0,window.innerHeight||0),rect=contentRef.current.getBoundingClientRect(),anchorHeight=anchorRef.current.getBoundingClientRect().height,anchorX=anchorRef.current.getBoundingClientRect().x,screenWidth=window.innerWidth,isUp=rect.top+rect.height>maxHeight,isDown=rect.top-anchorHeight<rect.height;forceVerticalPosition?setVerticalPosition(forceVerticalPosition):isUp?setVerticalPosition("up"):isDown&&setVerticalPosition("down"),anchorX>screenWidth/2?setHorizontalPosition("left"):anchorX<screenWidth/2&&setHorizontalPosition("right")}else setVerticalPosition("down"),setHorizontalPosition("left")},[anchorRef,contentRef,document.documentElement.clientHeight,isActive,window.innerHeight,window.innerWidth,forceVerticalPosition]),[verticalPosition,horizontalPosition]};

package/build/cjs/shared/useBreakpoints.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"useBreakpoints",{enumerable:!0,get:function(){return useBreakpoints}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=require("react"),_breakpointsjson=/*#__PURE__*/_interop_require_default._(require("../web-tokens/_breakpoints.json")),_useWindow=require("./useWindow"),SERVER_SNAPSHOT={isSmallMobile:!1,isMobile:!1,isTablet:!1,isDesktop:!0,isLargeDesktop:!0},snapshotCache=new Map,computeSnapshot=width=>{let snapshot=snapshotCache.get(width);return snapshot||(snapshot={isSmallMobile:width<_breakpointsjson.default.s.value,isMobile:width<_breakpointsjson.default.m.value,isTablet:width>=_breakpointsjson.default.m.value&&width<_breakpointsjson.default.l.value,isDesktop:width>=_breakpointsjson.default.l.value,isLargeDesktop:width>=_breakpointsjson.default.xl.value},snapshotCache.set(width,snapshot)),snapshot},getServerSnapshot=()=>SERVER_SNAPSHOT;function useBreakpoints(){let window=(0,_useWindow.useWindow)(),subscribe=(0,_react.useCallback)(callback=>window?(window.addEventListener("resize",callback),()=>window.removeEventListener("resize",callback)):()=>{},[window]),getSnapshot=(0,_react.useCallback)(()=>window?computeSnapshot(window.innerWidth):SERVER_SNAPSHOT,[window]);return(0,_react.useSyncExternalStore)(subscribe,getSnapshot,getServerSnapshot)}
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"useBreakpoints",{enumerable:!0,get:function(){return useBreakpoints}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=require("react"),_breakpointsjson=/*#__PURE__*/_interop_require_default._(require("../web-tokens/_breakpoints.json")),_useWindow=require("./useWindow");function useBreakpoints(){let window=(0,_useWindow.useWindow)(),[width,setWidth]=(0,_react.useState)(()=>window?window.innerWidth:_breakpointsjson.default.xl.value);return(0,_react.useEffect)(()=>{if(!window)return;let handleResize=()=>{setWidth(window.innerWidth)};return handleResize(),window.addEventListener("resize",handleResize),()=>window.removeEventListener("resize",handleResize)},[window]),(0,_react.useMemo)(()=>({isSmallMobile:width<_breakpointsjson.default.s.value,isMobile:width<_breakpointsjson.default.m.value,isTablet:width>=_breakpointsjson.default.m.value&&width<_breakpointsjson.default.l.value,isDesktop:width>=_breakpointsjson.default.l.value,isLargeDesktop:width>=_breakpointsjson.default.xl.value}),[width])}

package/build/cjs/shared/useDragTransform.d.ts

@@ -0,0 +1,39 @@
+import type { RefObject } from "react";
+import type { MoveEndEvent, MoveMoveEvent, MoveStartEvent } from "@react-aria/interactions";
+export type Position = {
+    x: number;
+    y: number;
+};
+export type UseDragTransformOptions<T extends HTMLElement> = {
+    /** Ref of the element to move */
+    ref: RefObject<T>;
+    /** Minimum distance to keep between the element and the viewport edges */
+    edgeOffset?: number;
+    /** Distance (px) the element moves per arrow-key press while the handle is
+     *  focused. react-aria emits 1px keyboard deltas; this scales them. */
+    keyboardStep?: number;
+    /** Cursor shown on the element while a drag is in progress. Default `grabbing`. */
+    draggingCursor?: string;
+    /** Called once a drag ends, with the element's persisted translate offset */
+    onDragEnd?: (translate: Position) => void;
+};
+/** Pass these to a react-aria `useMove` call to drive the transform. */
+export type DragMoveHandlers = {
+    onMoveStart: (event: MoveStartEvent) => void;
+    onMove: (event: MoveMoveEvent) => void;
+    onMoveEnd: (event: MoveEndEvent) => void;
+};
+export type UseDragTransformResult = DragMoveHandlers & {
+    isDragging: boolean;
+};
+/**
+ * Applies a clamped `translate3d` to an element from movement deltas, keeping it
+ * within `edgeOffset` px of the viewport edges. Input-agnostic: it consumes
+ * react-aria `useMove` events (pointer, touch, and keyboard), so the caller owns
+ * where `moveProps` is spread while this owns the geometry. Works with any
+ * existing positioning (fixed, absolute, floating-ui) because it only layers a
+ * translate delta on top of the element's own rendered position. The transform
+ * is written directly to the element per move
+ * to avoid a re-render per pixel; React state only tracks `isDragging`.
+ */
+export declare function useDragTransform<T extends HTMLElement>({ ref, edgeOffset, keyboardStep, draggingCursor, onDragEnd, }: UseDragTransformOptions<T>): UseDragTransformResult;

package/build/cjs/shared/useDragTransform.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"useDragTransform",{enumerable:!0,get:function(){return useDragTransform}});const _react=require("react"),_useWindow=require("./useWindow"),clamp=({value,min,max})=>max<min?min:Math.min(Math.max(value,min),max),computeClampedTopLeft=({proposedTopLeft,elementSize,viewportSize,edgeOffset})=>({x:clamp({value:proposedTopLeft.x,min:edgeOffset,max:viewportSize.width-elementSize.width-edgeOffset}),y:clamp({value:proposedTopLeft.y,min:edgeOffset,max:viewportSize.height-elementSize.height-edgeOffset})}),INITIAL_TRANSLATE={x:0,y:0};function useDragTransform({ref,edgeOffset=0,keyboardStep=10,draggingCursor="grabbing",onDragEnd}){let currentWindow=(0,_useWindow.useWindow)(),[isDragging,setIsDragging]=(0,_react.useState)(!1),appliedTranslateRef=(0,_react.useRef)(INITIAL_TRANSLATE),accumulatedDeltaRef=(0,_react.useRef)(INITIAL_TRANSLATE),rectAtDragStartRef=(0,_react.useRef)(null),previousElementCursorRef=(0,_react.useRef)(""),previousElementUserSelectRef=(0,_react.useRef)(""),resolveTranslate=(0,_react.useCallback)(()=>{let rectAtDragStart=rectAtDragStartRef.current;if(!rectAtDragStart||!currentWindow)return appliedTranslateRef.current;let clampedTopLeft=computeClampedTopLeft({proposedTopLeft:{x:rectAtDragStart.left+accumulatedDeltaRef.current.x,y:rectAtDragStart.top+accumulatedDeltaRef.current.y},elementSize:{width:rectAtDragStart.width,height:rectAtDragStart.height},viewportSize:{width:currentWindow.innerWidth,height:currentWindow.innerHeight},edgeOffset});return{x:appliedTranslateRef.current.x+(clampedTopLeft.x-rectAtDragStart.left),y:appliedTranslateRef.current.y+(clampedTopLeft.y-rectAtDragStart.top)}},[currentWindow,edgeOffset]),onMoveStart=(0,_react.useCallback)(()=>{let element=ref.current;element&&(rectAtDragStartRef.current=element.getBoundingClientRect(),accumulatedDeltaRef.current=INITIAL_TRANSLATE,previousElementCursorRef.current=element.style.cursor,previousElementUserSelectRef.current=element.style.userSelect,element.style.cursor=draggingCursor,element.style.userSelect="none",setIsDragging(!0))},[ref,draggingCursor]),onMove=(0,_react.useCallback)(event=>{let element=ref.current;if(!element||!rectAtDragStartRef.current)return;let factor="keyboard"===event.pointerType?keyboardStep:1;accumulatedDeltaRef.current={x:accumulatedDeltaRef.current.x+event.deltaX*factor,y:accumulatedDeltaRef.current.y+event.deltaY*factor};let{x,y}=resolveTranslate();element.style.transform=`translate3d(${x}px, ${y}px, 0)`},[ref,keyboardStep,resolveTranslate]),onMoveEnd=(0,_react.useCallback)(()=>{rectAtDragStartRef.current&&(appliedTranslateRef.current=resolveTranslate()),rectAtDragStartRef.current=null;let element=ref.current;element&&(element.style.cursor=previousElementCursorRef.current,element.style.userSelect=previousElementUserSelectRef.current),setIsDragging(!1),onDragEnd?.(appliedTranslateRef.current)},[ref,resolveTranslate,onDragEnd]);return(0,_react.useEffect)(()=>()=>{let element=ref.current;rectAtDragStartRef.current&&element&&(element.style.cursor=previousElementCursorRef.current,element.style.userSelect=previousElementUserSelectRef.current)},[ref]),(0,_react.useEffect)(()=>{if(!currentWindow)return;let reconcileFrame=0,reconcileTranslateToViewport=()=>{let element=ref.current,applied=appliedTranslateRef.current,isIdle=!rectAtDragStartRef.current,hasOffset=0!==applied.x||0!==applied.y;if(!element||!isIdle||!hasOffset)return;let rect=element.getBoundingClientRect(),clampedTopLeft=computeClampedTopLeft({proposedTopLeft:{x:rect.left,y:rect.top},elementSize:{width:rect.width,height:rect.height},viewportSize:{width:currentWindow.innerWidth,height:currentWindow.innerHeight},edgeOffset}),nextTranslate={x:applied.x+(clampedTopLeft.x-rect.left),y:applied.y+(clampedTopLeft.y-rect.top)};(nextTranslate.x!==applied.x||nextTranslate.y!==applied.y)&&(appliedTranslateRef.current=nextTranslate,element.style.transform=`translate3d(${nextTranslate.x}px, ${nextTranslate.y}px, 0)`)},handleResize=()=>{currentWindow.cancelAnimationFrame(reconcileFrame),reconcileFrame=currentWindow.requestAnimationFrame(reconcileTranslateToViewport)};return currentWindow.addEventListener("resize",handleResize),()=>{currentWindow.cancelAnimationFrame(reconcileFrame),currentWindow.removeEventListener("resize",handleResize)}},[currentWindow,edgeOffset,ref]),{isDragging,onMoveStart,onMove,onMoveEnd}}

package/build/cjs/web-tokens/_sizes.json

@@ -37,7 +37,7 @@
         "value": "1024px",
         "original": 1024,
         "variableName": "$size-dimension-content-max-width",
-        "isUsed": true
+        "isUsed": false
     },
     {
         "category": "size",
@@ -47,7 +47,7 @@
         "value": "16px",
         "original": 16,
         "variableName": "$size-dimension-divider-m",
-        "isUsed": true
+        "isUsed": false
     },
     {
         "category": "size",
@@ -57,7 +57,7 @@
         "value": "24px",
         "original": 24,
         "variableName": "$size-dimension-divider-l",
-        "isUsed": true
+        "isUsed": false
     },
     {
         "category": "size",
@@ -67,7 +67,7 @@
         "value": "32px",
         "original": 32,
         "variableName": "$size-dimension-divider-xl",
-        "isUsed": true
+        "isUsed": false
     },
     {
         "category": "size",
@@ -77,7 +77,7 @@
         "value": "16px",
         "original": 16,
         "variableName": "$size-dimension-checkbox-s",
-        "isUsed": true
+        "isUsed": false
     },
     {
         "category": "size",
@@ -87,7 +87,7 @@
         "value": "24px",
         "original": 24,
         "variableName": "$size-dimension-checkbox-m",
-        "isUsed": true
+        "isUsed": false
     },
     {
         "category": "size",
@@ -97,7 +97,7 @@
         "value": "16px",
         "original": 16,
         "variableName": "$size-dimension-radio-s",
-        "isUsed": true
+        "isUsed": false
     },
     {
         "category": "size",
@@ -107,7 +107,7 @@
         "value": "24px",
         "original": 24,
         "variableName": "$size-dimension-radio-m",
-        "isUsed": true
+        "isUsed": false
     },
     {
         "category": "size",
@@ -117,7 +117,7 @@
         "value": "6px",
         "original": 6,
         "variableName": "$size-dimension-radio-point-s",
-        "isUsed": true
+        "isUsed": false
     },
     {
         "category": "size",
@@ -127,7 +127,7 @@
         "value": "10px",
         "original": 10,
         "variableName": "$size-dimension-radio-point-m",
-        "isUsed": true
+        "isUsed": false
     },
     {
         "category": "size",
@@ -137,7 +137,7 @@
         "value": "16px",
         "original": 16,
         "variableName": "$size-dimension-toggle-height-s",
-        "isUsed": true
+        "isUsed": false
     },
     {
         "category": "size",
@@ -147,7 +147,7 @@
         "value": "24px",
         "original": 24,
         "variableName": "$size-dimension-toggle-height-m",
-        "isUsed": true
+        "isUsed": false
     },
     {
         "category": "size",
@@ -157,7 +157,7 @@
         "value": "28px",
         "original": 28,
         "variableName": "$size-dimension-toggle-width-s",
-        "isUsed": true
+        "isUsed": false
     },
     {
         "category": "size",
@@ -167,7 +167,7 @@
         "value": "40px",
         "original": 40,
         "variableName": "$size-dimension-toggle-width-m",
-        "isUsed": true
+        "isUsed": false
     },
     {
         "category": "size",
@@ -177,7 +177,7 @@
         "value": "36px",
         "original": 36,
         "variableName": "$size-dimension-textarea-min-height-m",
-        "isUsed": true
+        "isUsed": false
     },
     {
         "category": "size",
@@ -187,7 +187,7 @@
         "value": "8px",
         "original": 8,
         "variableName": "$size-dimension-toggle-point-s",
-        "isUsed": true
+        "isUsed": false
     },
     {
         "category": "size",
@@ -197,7 +197,7 @@
         "value": "16px",
         "original": 16,
         "variableName": "$size-dimension-toggle-point-m",
-        "isUsed": true
+        "isUsed": false
     },
     {
         "category": "size",
@@ -207,7 +207,7 @@
         "value": "32px",
         "original": 32,
         "variableName": "$size-dimension-toggle-button-height-m",
-        "isUsed": true
+        "isUsed": false
     },
     {
         "category": "size",
@@ -217,7 +217,7 @@
         "value": "120px",
         "original": 120,
         "variableName": "$size-dimension-dropdown-menu-width",
-        "isUsed": true
+        "isUsed": false
     },
     {
         "category": "size",
@@ -227,7 +227,7 @@
         "value": "560px",
         "original": 560,
         "variableName": "$size-dimension-modal-width-m",
-        "isUsed": true
+        "isUsed": false
     },
     {
         "category": "size",
@@ -237,7 +237,7 @@
         "value": "720px",
         "original": 720,
         "variableName": "$size-dimension-modal-width-l",
-        "isUsed": true
+        "isUsed": false
     },
     {
         "category": "size",
@@ -247,7 +247,7 @@
         "value": "800px",
         "original": 800,
         "variableName": "$size-dimension-modal-max-height-l",
-        "isUsed": true
+        "isUsed": false
     },
     {
         "category": "size",
@@ -257,7 +257,7 @@
         "value": "40px",
         "original": 40,
         "variableName": "$size-dimension-modal-margin-l",
-        "isUsed": true
+        "isUsed": false
     },
     {
         "category": "size",
@@ -267,7 +267,7 @@
         "value": "1280px",
         "original": 1280,
         "variableName": "$size-dimension-modal-full-screen-content-width",
-        "isUsed": true
+        "isUsed": false
     },
     {
         "category": "size",
@@ -277,7 +277,7 @@
         "value": "1px",
         "original": 1,
         "variableName": "$size-dimension-media-viewer-bar-separator-width",
-        "isUsed": true
+        "isUsed": false
     },
     {
         "category": "size",
@@ -287,7 +287,7 @@
         "value": "12px",
         "original": 12,
         "variableName": "$size-dimension-legend-key-width",
-        "isUsed": true
+        "isUsed": false
     },
     {
         "category": "size",
@@ -297,7 +297,7 @@
         "value": "0px",
         "original": 0,
         "variableName": "$size-letter-spacing-none",
-        "isUsed": true
+        "isUsed": false
     },
     {
         "category": "size",
@@ -307,7 +307,7 @@
         "value": "0.5px",
         "original": 0.5,
         "variableName": "$size-letter-spacing-s",
-        "isUsed": true
+        "isUsed": false
     },
     {
         "category": "size",
@@ -317,7 +317,17 @@
         "value": "1px",
         "original": 1,
         "variableName": "$size-letter-spacing-m",
-        "isUsed": true
+        "isUsed": false
+    },
+    {
+        "category": "size",
+        "type": "font",
+        "name": "font xxs",
+        "subitemName": "xxs",
+        "value": "10px",
+        "original": 10,
+        "variableName": "$size-font-xxs",
+        "isUsed": false
     },
     {
         "category": "size",
@@ -327,7 +337,7 @@
         "value": "12px",
         "original": 12,
         "variableName": "$size-font-xs",
-        "isUsed": true
+        "isUsed": false
     },
     {
         "category": "size",
@@ -337,7 +347,7 @@
         "value": "14px",
         "original": 14,
         "variableName": "$size-font-s",
-        "isUsed": true
+        "isUsed": false
     },
     {
         "category": "size",
@@ -347,7 +357,7 @@
         "value": "16px",
         "original": 16,
         "variableName": "$size-font-m",
-        "isUsed": true
+        "isUsed": false
     },
     {
         "category": "size",
@@ -357,7 +367,7 @@
         "value": "18px",
         "original": 18,
         "variableName": "$size-font-l",
-        "isUsed": true
+        "isUsed": false
     },
     {
         "category": "size",
@@ -367,7 +377,7 @@
         "value": "20px",
         "original": 20,
         "variableName": "$size-font-xl",
-        "isUsed": true
+        "isUsed": false
     },
     {
         "category": "size",
@@ -377,7 +387,7 @@
         "value": "24px",
         "original": 24,
         "variableName": "$size-font-xxl",
-        "isUsed": true
+        "isUsed": false
     },
     {
         "category": "size",
@@ -387,7 +397,7 @@
         "value": "26px",
         "original": 26,
         "variableName": "$size-font-xxxl",
-        "isUsed": true
+        "isUsed": false
     },
     {
         "category": "size",
@@ -407,7 +417,7 @@
         "value": "2px",
         "original": 2,
         "variableName": "$size-spacing-xxxs",
-        "isUsed": true
+        "isUsed": false
     },
     {
         "category": "size",
@@ -487,7 +497,7 @@
         "value": "0px",
         "original": 0,
         "variableName": "$size-border-radius-none",
-        "isUsed": true
+        "isUsed": false
     },
     {
         "category": "size",
@@ -497,7 +507,7 @@
         "value": "4px",
         "original": 4,
         "variableName": "$size-border-radius-xs",
-        "isUsed": true
+        "isUsed": false
     },
     {
         "category": "size",
@@ -507,7 +517,7 @@
         "value": "8px",
         "original": 8,
         "variableName": "$size-border-radius-s",
-        "isUsed": true
+        "isUsed": false
     },
     {
         "category": "size",
@@ -517,7 +527,7 @@
         "value": "12px",
         "original": 12,
         "variableName": "$size-border-radius-m",
-        "isUsed": true
+        "isUsed": false
     },
     {
         "category": "size",
@@ -527,7 +537,7 @@
         "value": "16px",
         "original": 16,
         "variableName": "$size-border-radius-l",
-        "isUsed": true
+        "isUsed": false
     },
     {
         "category": "size",
@@ -537,7 +547,7 @@
         "value": "24px",
         "original": 24,
         "variableName": "$size-border-radius-xl",
-        "isUsed": true
+        "isUsed": false
     },
     {
         "category": "size",
@@ -547,7 +557,7 @@
         "value": "9999px",
         "original": 9999,
         "variableName": "$size-border-radius-full",
-        "isUsed": true
+        "isUsed": false
     },
     {
         "category": "size",
@@ -557,7 +567,7 @@
         "value": 1.1428571429,
         "original": 1.1428571429,
         "variableName": "$size-line-height-xs",
-        "isUsed": true
+        "isUsed": false
     },
     {
         "category": "size",
@@ -567,7 +577,7 @@
         "value": 1.25,
         "original": 1.25,
         "variableName": "$size-line-height-s",
-        "isUsed": true
+        "isUsed": false
     },
     {
         "category": "size",
@@ -577,7 +587,7 @@
         "value": 1.3333333,
         "original": 1.3333333,
         "variableName": "$size-line-height-m",
-        "isUsed": true
+        "isUsed": false
     },
     {
         "category": "size",
@@ -587,7 +597,7 @@
         "value": 1.4285714286,
         "original": 1.4285714286,
         "variableName": "$size-line-height-l",
-        "isUsed": true
+        "isUsed": false
     },
     {
         "category": "size",
@@ -597,7 +607,7 @@
         "value": 1.5,
         "original": 1.5,
         "variableName": "$size-line-height-xl",
-        "isUsed": true
+        "isUsed": false
     },
     {
         "category": "size",
@@ -607,7 +617,7 @@
         "value": 1.625,
         "original": 1.625,
         "variableName": "$size-line-height-xxl",
-        "isUsed": true
+        "isUsed": false
     },
     {
         "category": "size",
@@ -617,6 +627,6 @@
         "value": 1.714286,
         "original": 1.714286,
         "variableName": "$size-line-height-xxxl",
-        "isUsed": true
+        "isUsed": false
     }
 ]

package/build/cjs/web-tokens/layout-vars.d.ts

@@ -2,6 +2,8 @@ export declare const LAYOUT_VARS: {
     readonly contentWidth: "--ds-layout-content-width";
     readonly rightPanelWidth: "--ds-layout-rightPanel-width";
     readonly subnavOffset: "--ds-layout-subnav-offset";
+    readonly floatWidth: "--ds-layout-float-width";
+    readonly floatHeight: "--ds-layout-float-height";
 };
 export type LayoutVarKey = keyof typeof LAYOUT_VARS;
 export type LayoutVarName = (typeof LAYOUT_VARS)[LayoutVarKey];

package/build/cjs/web-tokens/layout-vars.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"LAYOUT_VARS",{enumerable:!0,get:function(){return LAYOUT_VARS}});const LAYOUT_VARS={contentWidth:"--ds-layout-content-width",rightPanelWidth:"--ds-layout-rightPanel-width",subnavOffset:"--ds-layout-subnav-offset"};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"LAYOUT_VARS",{enumerable:!0,get:function(){return LAYOUT_VARS}});const LAYOUT_VARS={contentWidth:"--ds-layout-content-width",rightPanelWidth:"--ds-layout-rightPanel-width",subnavOffset:"--ds-layout-subnav-offset",floatWidth:"--ds-layout-float-width",floatHeight:"--ds-layout-float-height"};

package/build/cjs/web-tokens/layout-vars.ts

@@ -5,6 +5,8 @@ export const LAYOUT_VARS = {
   contentWidth: "--ds-layout-content-width",
   rightPanelWidth: "--ds-layout-rightPanel-width",
   subnavOffset: "--ds-layout-subnav-offset",
+  floatWidth: "--ds-layout-float-width",
+  floatHeight: "--ds-layout-float-height",
 } as const;
 
 export type LayoutVarKey = keyof typeof LAYOUT_VARS;

package/build/cjs/web-tokens/visualConfig.d.ts

@@ -81,6 +81,7 @@ type Variables = {
             "m": string;
         };
         "font": {
+            "xxs": string;
             "xs": string;
             "s": string;
             "m": string;
@@ -213,6 +214,14 @@ type Variables = {
                 "default": string;
             };
         };
+        "float": {
+            "width": {
+                "default": string;
+            };
+            "height": {
+                "default": string;
+            };
+        };
     };
     "opacity": {
         "hidden": number;