@frontfriend/tailwind 4.0.0 → 4.0.2

package/scripts/master-components-config.json

@@ -0,0 +1,953 @@
+{
+    "accordion": {
+      "root": "border border-neutral-low rounded-md [&>*:last-child]:border-b-0 font-primary",
+      "font": "font-primary text-brand-strong",
+      "last" : "[&>*]:border-b-0",
+      "header" : "flex",
+      "item": "border-b border-neutral-low",
+      "trigger": {
+        "root" : "flex flex-1 items-center text-brand-strong active:text-brand-mid justify-between p-4 font-semibold transition-all [&[data-state=open]>svg]:rotate-180",
+        "icon": "shrink-0 transition-transform duration-200"
+      },
+      "content": {
+        "root" : "overflow-hidden text-sm transition-all data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down text-neutral-mid",
+        "wrapper" : "p-4 pt-0"
+      }
+    },
+    "actionbar": {
+      "root" : "pb-safe-bottom w-full justify-center border-t border-neutral-low z-20 bg-layer-raised items-center absolute bottom-0 left-1/2 transform -translate-x-1/2 flex",
+      "content": "gap-3 lg:gap-8 flex flex-row w-full",
+      "compact": "py-4 px-4",
+      "relaxed": "px-6 py-6",
+      "maxWidth": "max-w-2xl",
+      "align": {
+        "start": "justify-start",
+        "end": "justify-end",
+        "center": "justify-center",
+        "justify": "justify-between",
+        "stretch": "[&>*]:flex-1"
+      }
+    },
+    "alert": {
+      "root": "relative w-full rounded min-h-12 border gap-2 p-4 [&>svg~*]:pl-7 flex flex-col justify-center [&>svg]:absolute [&>svg]:left-4 [&>svg]:top-4 font-primary shadow-sm",
+      "variant": {
+        "default": "bg-neutral-subtle border border-transparent [&>svg]:text-icon-neutral-low text-neutral-mid [&>div]:text-neutral-low",
+        "destructive": "bg-negative-low border border-transparent [&>svg]:text-icon-onnegative-low text-onnegative-low",
+        "info": "bg-info-low border border-transparent [&>svg]:text-icon-oninfo-low text-oninfo-low",
+        "success": "bg-positive-low border border-transparent [&>svg]:text-icon-onpositive-low text-onpositive-low",
+        "warning": "bg-warning-low border border-transparent [&>svg]:text-icon-onwarning-low text-onwarning-low",
+        "brand": "bg-brand-low border border-transparent [&>svg]:text-icon-onbrand-low text-onbrand-low"
+      },
+      "title": "text-base leading-none tracking-tight font-semibold mb-0",
+      "description": "text-sm [&_p]:leading-relaxed leading-relaxed font-normal"
+    },
+    "alertDialog": {
+      "overlay": "fixed inset-0 z-50 bg-overlay-mid  data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
+      "content": "font-primary border border-neutral-subtle fixed left-[50%] top-[50%] z-50 max-w-[90vw] grid w-full lg:max-w-lg translate-x-[-50%] translate-y-[-50%] gap-6 border border-neutral-subtle bg-layer-dialog p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] rounded-lg shadow-2xl",
+      "header": "flex flex-col space-y-2 gap-0.5 text-left",
+      "footer": "flex flex-row justify-end gap-4",
+      "title": "text-lg font-semibold text-neutral-mid",
+      "description": "text-sm text-neutral-subtle font-medium",
+      "cancel": "sm:mt-0"
+    },
+    "avatar": {
+      "root": "font-primary relative border-neutral-low flex h-10 w-10 shrink-0 overflow-hidden rounded-full",
+      "image": "aspect-square h-full w-full",
+      "fallback": "bg-brand-low flex h-full w-full items-center justify-center rounded-full text-interactive-mid text-[40cqw]"
+    },
+    "badge": {
+      "root": "font-primary shrink-0 [&>svg]:h-4 [&>svg]:w-4 gap-x-1 pt-0.5 pb-0.5 pl-2.5 pr-2.5 rounded-sm text-xs leading-snug font-medium border flex items-center justify-center box-border h-5 inline-flex overflow-hidden",
+      "variant": {
+        "main": "bg-brand-mid border-transparent text-onbrand-mid [&>svg]:text-icon-onbrand-mid",
+        "secondary": "bg-interactive-mid border-transparent text-oninteractive-mid [&>svg]:text-icon-oninteractive-mid",
+        "destructive": "bg-negative-mid border-transparent text-onnegative-mid [&>svg]:text-icon-onnegative-mid",
+        "success": "bg-positive-mid border-transparent text-onpositive-mid [&>svg]:text-icon-onpositive-mid",
+        "tertiary": "bg-transparent border-neutral-subtle text-brand-strong [&>svg]:text-icon-brand-strong",
+        "warning": "bg-warning-mid border-transparent text-onwarning-mid [&>svg]:text-icon-onwarning-mid",
+        "brand": "bg-brand-strong border-transparent text-onbrand-strong [&>svg]:text-icon-onbrand-strong",
+        "informative": "bg-info-mid border-transparent text-oninfo-mid [&>svg]:text-icon-oninfo-mid",
+        "highlight": "bg-highlight-mid border-transparent text-onhighlight-mid [&>svg]:text-icon-onhighlight-mid",
+        "subtle": {
+          "main": "bg-brand-subtle border-transparent text-onbrand-subtle [&>svg]:text-icon-onbrand-subtle",
+          "secondary": "bg-interactive-subtle border-transparent text-oninteractive-subtle [&>svg]:text-icon-oninteractive-subtle",
+          "destructive": "bg-negative-subtle border-transparent text-onnegative-subtle [&>svg]:text-icon-onnegative-subtle",
+          "success": "bg-positive-subtle border-transparent text-onpositive-subtle [&>svg]:text-icon-onpositive-subtle",
+          "warning": "bg-warning-subtle border-transparent text-onwarning-subtle [&>svg]:text-icon-onwarning-subtle",
+          "tertiary": "bg-neutral-subtle border-transparent text-neutral-mid [&>svg]:text-icon-neutral-mid",
+          "brand": "bg-brand-subtle border-transparent text-onbrand-subtle [&>svg]:text-icon-onbrand-subtle",
+          "informative": "bg-info-subtle border-transparent text-oninfo-subtle [&>svg]:text-icon-oninfo-subtle",
+          "highlight": "bg-highlight-subtle border-transparent text-onhighlight-subtle [&>svg]:text-icon-onhighlight-subtle"
+        }
+      },
+      "dismissable": "hover:opacity-80",
+      "icon": "cursor-pointer",
+      "bullet": "p-0.5 w-5 h-5"
+    },
+    "button": {
+      "root": "font-primary group rounded disabled:opacity-100 inline-flex items-center justify-center disabled:cursor-not-allowed gap-2",
+      "variant": {
+        "main": "bg-brand-mid hover:bg-brand-mid-hover active:bg-brand-mid-active disabled:bg-disabled text-onbrand-mid hover:text-onbrand-mid-hover active:text-onbrand-mid-active disabled:text-disabled border-brand-strong hover:border-transperent active:border-transperent disabled:border-disabled border-0",
+        "secondary": "bg-layer-control hover:bg-brand-low-hover active:bg-brand-low-active disabled:bg-disabled text-brand-mid hover:text-brand-mid-hover active:text-brand-mid-active disabled:text-disabled border-brand-mid hover:border-brand-mid-hover active:border-brand-mid-active border border-t border-b border-r border-l",
+        "tertiary": "bg-layer-control hover:bg-neutral-subtle-hover active:bg-neutral-subtle-active disabled:bg-disabled text-neutral-subtle hover:text-neutral-mid-hover active:text-neutral-mid-active disabled:text-disabled border-neutral-subtle hover:border-neutral-low-hover active:border-neutral-subtle-active disabled:border-transparent border border-t border-b border-r border-l",
+        "destructive": "bg-negative-mid hover:bg-negative-mid-hover active:bg-negative-mid-active disabled:bg-disabled text-onnegative-mid hover:text-onnegative-mid-hover active:text-onnegative-mid-active disabled:text-disabled border-transparent disabled:border-disabled border-0",
+        "ghost": "bg-transparent hover:bg-neutral-subtle-hover active:bg-neutral-subtle-active disabled:bg-transparent text-neutral-mid hover:text-neutral-mid-hover active:text-neutral-mid-active disabled:text-disabled border-transparent hover:border-transparent active:border-transparent disabled:border-transparent border-0",
+        "ghostmain": "bg-transparent hover:bg-brand-low-hover active:bg-brand-low-active disabled:bg-transparent text-brand-mid hover:text-brand-mid-hover active:text-brand-mid-active disabled:text-disabled border-transparent hover:border-transparent active:border-transparent disabled:border-transparent",
+        "link": "text-interactive-mid hover:interactive-brand-mid-hover active:text-interactive-mid-active disabled:text-disabled",
+        "linkdestructive": "text-negative-mid hover:text-negative-mid-hover active:text-negative-mid-active disabled:text-disabled"
+      },
+      "size": {
+        "default": "text-base font-medium tracking-0 pl-4 pr-4 h-10",
+        "sm": "text-sm font-medium tracking-0 pl-3 pr-3 h-9",
+        "lg": "text-base font-semibold tracking-0 pl-4 pr-4 h-12"
+      },
+      "icon": {
+        "root": "gap-2",
+        "size": {
+          "sm": "4",
+          "default": "5",
+          "lg": "6"
+        },
+        "color": {
+          "main": "text-icon-onbrand-mid group-hover:text-icon-onbrand-mid-hover group-active:text-icon-onbrand-mid-active group-disabled:text-disabled",
+          "secondary": "text-icon-brand-mid group-hover:text-icon-brand-mid-active group-active:text-icon-brand-mid-active group-disabled:text-disabled",
+          "destructive": "text-icon-onnegative-mid group-hover:text-icon-onnegative-mid-hover group-active:text-icon-onnegative-mid-active group-disabled:text-disabled",
+          "ghost": "text-icon-neutral-mid group-hover:text-icon-neutral-mid-hover group-active:text-icon-neutral-mid-active group-disabled:text-disabled",
+          "tertiary": "text-icon-neutral-subtle group-hover:text-icon-neutral-mid-hover group-active:text-icon-neutral-mid-active group-disabled:text-disabled",
+          "ghostmain": "text-icon-brand-mid group-hover:text-icon-brand-mid-hover group-active:text-icon-brand-mid-active group-disabled:text-disabled",
+          "link": "text-icon-interactive-mid group-hover:text-icon-brand-mid-hover group-active:text-icon-brand-mid-active group-disabled:text-disabled",
+          "linkdestructive": "text-icon-negative-mid group-hover:text-icon-negative-mid-hover group-active:text-icon-negative-mid-active group-disabled:text-disabled"
+        }
+      },
+      "iconPosition": {
+        "prefix": {
+          "small": "pl-2",
+          "default": "pl-3",
+          "large": "pl-3"
+        },
+        "suffix": {
+          "small": "pr-2",
+          "default": "pr-3",
+          "large": "pr-3"
+        },
+        "default": {
+          "small": "pl-2 pr-2 w-9",
+          "default": "pl-3 pr-3 w-10",
+          "large": "pl-3 pr-3 w-12"
+        }
+      },
+      "fullwidth": {
+        "false": "",
+        "true": "w-full"
+      },
+      "defaultVariants": {
+        "variant": "main",
+        "size": "default"
+      },
+      "compoundVariants": {
+        "links": "p-0 text-sm font-medium tracking-0 h-fit"
+      }
+    },
+    "calendar": {
+      "root": "p-3 rounded-md font-primary",
+      "caption" : {
+        "root" : "flex justify-center pt-1 relative items-center",
+        "label": "text-sm text-neutral-mid leading-snug font-medium"
+      },
+      "months": "flex flex-col sm:flex-row space-y-4 sm:space-x-4 sm:space-y-0",
+      "month": "space-y-4",
+      "nav" : {
+        "root" :"space-x-1 flex items-center",
+        "button" : {
+          "root" : "h-7 w-7 bg-transparent p-0 opacity-50 hover:opacity-100",
+          "previous" : "absolute left-1",
+          "next": "absolute right-1"
+        }
+      },
+      "row": "flex w-full mt-2 cursor-not-allowed",
+      "table": "w-full border-collapse space-y-1",
+      "head" : {
+        "row" : "flex",
+        "cell": "text-neutral-subtle leading-snug w-9 font-normal text-sm"
+      },
+      "cell": "text-center text-sm p-0 relative [&:has([aria-selected])]:bg-neutral-low-hover first:[&:has([aria-selected])]:rounded-l-md last:[&:has([aria-selected])]:rounded-r-md focus-within:relative focus-within:z-20",
+      "day": {
+        "root" : "h-9 w-9 p-0 font-normal text-neutral-mid aria-selected:opacity-100 inline-flex items-center justify-center rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:opacity-50 disabled:pointer-events-none ring-offset-background hover:bg-neutral-low-hover aria-selected:hover:bg-interactive-mid-hover",
+        "range" : {
+          "end" : "day-range-end",
+          "middle" : "aria-selected:bg-neutral-low-hover aria-selected:text-neutral-mid aria-selected:hover:bg-neutral-low-hover"
+        },
+        "selected": "bg-interactive-mid text-oninteractive-mid hover:bg-interactive-mid-hover hover:text-oninteractive-mid-hover focus:bg-interactive-mid focus:text-oninteractive-mid",
+        "today": "bg-interactive-subtle text-oninteractive-low aria-selected:bg-interactive-mid aria-selected:text-oninteractive-mid aria-selected:hover:bg-interactive-mid-hover aria-selected:focus:bg-interactive-mid-hover",
+        "outside": "text-disabled opacity-50 aria-selected:text-neutral-mid day-outside aria-selected:bg-neutral-low-hover aria-selected:hover:bg-neutral-low-hover aria-selected:hover:text-neutral-mid aria-selected:focus:bg-neutral-low-hover aria-selected:focus:text-neutral-mid",
+        "disabled": "text-muted-foreground opacity-50",
+        "hidden": "invisible"
+      }
+    },
+    "card": {
+      "root": "rounded-2xl font-primary gap-0 border bg-layer-raised text-neutral-mid border-neutral-subtle relative shadow-sm",
+      "title": "text-base text-neutral-mid font-semibold leading-normal ",
+      "description": "text-xs font-medium text-neutral-subtle",
+      "header": "flex flex-col space-y-1.5 p-4 pb-0 rounded-t-2xl",
+      "content": "p-4 gap-4",
+      "footer": "flex gap-4 items-center p-4 bg-neutral-subtle rounded-b-2xl",
+      "footerAlign": {
+        "justify": "flex justify-between",
+        "end": "flex justify-end",
+        "start": "flex justify-start",
+        "stretch": "flex [&>*]:flex-1"
+      },
+      "outside" : "absolute w-full pt-8 mt-[-16px] -z-10",
+      "noContent": "p-4"
+    },
+    "chart": {
+      "container": "font-primary flex aspect-video justify-center text-xs [&_.recharts-cartesian-axis-tick_text]:fill-muted-foreground [&_.recharts-cartesian-grid_line]:stroke-border/50 [&_.recharts-curve.recharts-tooltip-cursor]:stroke-border [&_.recharts-dot[stroke='#fff']]:stroke-transparent [&_.recharts-layer]:outline-none [&_.recharts-polar-grid_[stroke='#ccc']]:stroke-border [&_.recharts-radial-bar-background-sector]:fill-muted [&_.recharts-rectangle.recharts-tooltip-cursor]:fill-muted [&_.recharts-reference-line-line]:stroke-border [&_.recharts-sector[stroke='#fff']]:stroke-transparent [&_.recharts-sector]:outline-none [&_.recharts-surface]:outline-none",
+      "dot" : {
+        "indicator" : {
+          "root" : "items-center",
+          "size" : "h-2.5 w-2.5"
+        }
+      },
+      "line" : {
+        "indicator" : {
+          "size" : "w-1"
+        }
+      },
+      "dashed" : {
+        "indicator" : {
+          "root" :"w-0 border-[1.5px] border-dashed bg-transparent",
+          "label" : "my-0.5"
+        }
+      },
+      "tooltip" : {
+        "root"  : "grid min-w-[8rem] items-start gap-1.5 rounded-lg border border-border/50 bg-background px-2.5 py-1.5 text-xs shadow-xl",
+        "label" : {
+          "root" : "font-mono font-medium tabular-nums text-foreground",
+          "wrapper" : "font-medium"
+        },
+        "payload" : {
+          "root" : "flex w-full items-stretch gap-2 [&>svg]:h-2.5 [&>svg]:w-2.5 [&>svg]:text-muted-foreground",
+          "wrapper" : "grid gap-1.5"
+        },
+        "indicator" : "shrink-0 rounded-[2px] border-[--color-border] bg-[--color-bg]",
+        "value" : "font-mono font-medium tabular-nums text-foreground"
+      },
+      "legend" : {
+        "content" : {
+          "root" : "flex items-center justify-center gap-4",
+          "wrapper" : "flex items-center gap-1.5 [&>svg]:h-3 [&>svg]:w-3 [&>svg]:text-muted-foreground"
+        },
+        "align" : {
+          "true" : "pb-3",
+          "false" : "pt-3"
+        },
+        "item" : "h-2 w-2 shrink-0 rounded-[2px]"
+      },
+      "nest" : {
+        "label" : {
+          "false" : "items-center",
+          "true" : "items-end",
+          "container" : "grid gap-1.5",
+          "text" : "text-muted-foreground"
+        }
+      }
+    },
+    "checkbox": {
+      "root": "peer rounded border w-5 h-5 disabled:opacity-50 disabled:cursor-not-allowed disabled:bg-neutral-strong disabled:border-disabled border-neutral-subtle hover:border-neutral-subtle-hover bg-layer-control hover:bg-neutral-low-hover data-[state=checked]:border-interactive-mid data-[state=checked]:hover:border-interactive-mid-hover data-[state=checked]:bg-interactive-mid data-[state=checked]:hover:bg-interactive-mid-hover shrink-0 shadow-sm",
+      "icon": "text-icon-inverse-mid hover:text-icon-inverse-mid flex items-center justify-center"
+    },
+    "checkboxField": {
+      "root": "flex items-center gap-2 font-primary w-fit",
+      "disabled": "opacity-5"
+    },
+    "command": {
+      "root": "flex h-full flex-col overflow-hidden rounded-2xl bg-layer-control text-popover-foreground py-1 font-primary",
+      "dialog": {
+        "content": "overflow-hidden p-0 shadow-lg",
+        "root": "[&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-muted-foreground [&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0 [&_[cmdk-group]]:px-2 [&_[cmdk-input-wrapper]_svg]:h-5 [&_[cmdk-input-wrapper]_svg]:w-5 [&_[cmdk-input]]:h-12 [&_[cmdk-item]]:px-2 [&_[cmdk-item]]:py-3 [&_[cmdk-item]_svg]:h-5 [&_[cmdk-item]_svg]:w-5"
+      },
+      "input": {
+        "root": "flex h-11 py-1.5 border-0 w-full border-neutral-subtle rounded-sm text-neutral-mid font-normal leading-normal bg-transparent px-1 text-sm outline-none placeholder:text-neutral-subtle disabled:cursor-not-allowed disabled:opacity-50",
+        "wrapper": "flex items-center border-b border-neutral-subtle px-3 text-neutral-subtle",
+        "icon": "h-4 w-4 shrink-0"
+      },
+      "list": "max-h-[300px] overflow-y-auto overflow-x-hidden",
+      "empty": "py-6 text-center text-sm leading-normal font-normal",
+      "group": "overflow-hidden p-1 text-foreground [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-muted-foreground",
+      "separator": "-mx-1 h-px bg-neutral-subtle",
+      "item": "relative flex justify-between cursor-base data-[highlighted]:bg-neutral-low-hover data-[highlighted]:text-neutral-mid-hover hover:bg-neutral-low-hover bg-transparent border-transparent hover:text-neutral-mid-hover disabled:text-disabled text-neutral-mid select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none data-[selected=true]:bg-neutral-low-hover data-[selected=true]:text-neutral-mid data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50",
+      "shortcut": "ml-auto text-xs text-neutral-subtle",
+      "combobox" : {
+        "label" : "px-2 py-1.5 text-xs font-medium text-muted-foreground"
+      }
+    },
+    "datePicker": {
+      "root": "w-[280px] justify-start text-left font-normal gap-y-0 [&>span]:truncate font-primary",
+      "button": "inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-normal ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 text-sm font-medium tracking-0 pl-4 pr-4 h-10 bg-neutral-low hover:bg-neutral-mid-hover active:bg-neutral-mid-active disabled:bg-disabled border-neutral-subtle hover:border-neutral-subtle-hovered active:border-neutral-subtle-active disabled:border-disabled border border-t border-b border-r border-l",
+      "isSelected": {
+        "true": "pointer-events-none",
+        "false": "w-full justify-start"
+      },
+      "trigger": {
+        "popover": "w-fit justify-start font-normal text-sm leading-none",
+        "text": "truncate text-default-mid",
+        "select": "w-full mx-auto mb-2"
+      },
+      "popover": {
+        "content": {
+          "root": "flex p-0 items-start gap-6 w-auto flex-col h-[563px] bg-layer-popover z-50",
+          "relaxed": "flex p-0 items-start gap-6 w-auto flex-col lg:flex-row h-[522px] lg:h-auto bg-layer-popover z-50",
+          "range": "w-auto p-0 z-50"
+        }
+      },
+      "presets": {
+        "relaxed": "flex flex-col items-sart gap-2 w-[150px]"
+      },
+      "separator": {
+        "root": "hidden",
+        "relaxed": "h-[397px] shrink-0 hidden lg:flex"
+      },
+      "dateInput": {
+        "relaxed": "lg:flex-row",
+        "root": "flex justify-between gap-6 w-full flex-col",
+        "wrapper": "flex gap-2 w-full",
+        "control": "w-full justify-center",
+        "separator": "py-1"
+      },
+      "calendar": {
+        "container": {
+          "wrapper": "h-[457px]",
+          "root": "flex flex-col gap-2 items-start justify-between",
+          "relaxed": "lg:w-[544px] h-[397px]"
+        }
+      },
+      "buttons": {
+        "root": "flex-1",
+        "relaxed": "lg:flex-initial",
+        "trigger": "w-fit justify-start",
+        "container": {
+          "root": "flex gap-2",
+          "relaxed": "lg:pr-4"
+        }
+      }
+    },
+    "dateInput" : {
+      "arrowUp" : "ArrowUp",
+      "arrowDown" : "ArrowDown",
+      "arrowLeft" : "ArrowLeft",
+      "arrowRight" : "ArrowRight",
+      "delete" : "Delete",
+      "tab" : "Tab",
+      "backspace" : "Backspace",
+      "enter" : "Enter",
+      "root" : "flex border rounded-lg items-center text-sm px-1 font-medium leading-5 font-primary text-default-subtle h-10 border-neutral-subtle shadow-sm",
+      "inputs" : {
+        "month" : "p-0 outline-none w-6 border-none text-center bg-layer-control",
+        "day" : "p-0 outline-none w-7 border-none text-center bg-layer-control",
+        "year" : "p-0 outline-none w-12 border-none text-center bg-layer-control"
+      },
+      "span" : "opacity-20 -mx-px"
+    },
+    "dialog": {
+      "overlay": "fixed inset-0 z-50 bg-overlay-mid data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
+      "content": "fixed flex flex-col lg:max-h-[90vh] max-h-[100vh] bg-layer-dialog font-primary left-[50%] overflow-clip top-[50%] z-50 w-full translate-x-[-50%] translate-y-[-50%] data-[state=open]:animate-in  data-[state=closed]:animate-out duration-200 border border-neutral-subtle data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-2xl shadow-2xl",
+      "body": "gap-0 flex flex-col h-full w-full overflow-y-auto mb-20 text-neutral-mid",
+      "close": "absolute right-4 top-4 opacity-70 transition-opacity hover:opacity-100 disabled:pointer-events-none",
+      "header": "flex gap-0.5 flex-col p-6 pr-14 space-y-1.5 text-left bg-layer-raised sticky top-0",
+      "footer": "bg-layer-raised gap-4 h-20 px-6 items-center fixed bottom-0 w-full flex",
+      "footerAlign": {
+        "justify": "flex justify-between",
+        "end": "flex justify-end",
+        "start": "flex justify-start",
+        "stretch": "flex [&>*]:flex-1"
+      },
+      "title": "text-2xl font-semibold leading-normal tracking-tight text-neutral-mid",
+      "description": "text-sm text-neutral-subtle leading-normal font-semibold",
+      "width" : {
+        "xs" : "max-w-sm",
+        "sm" : "max-w-sm",
+        "md" : "max-w-md",
+        "lg" : "max-w-lg",
+        "3xl" : "max-w-3xl",
+        "5xl" : "max-w-5xl",
+        "full" : "max-w-full",
+        "fit" : "max-w-fit"
+      },
+      "isSm" : "w-full",
+      "height" : {
+        "full" : "h-full",
+        "auto" : "h-auto",
+        "else" : "h-auto lg:h-full"
+      },
+      "padding" : {
+        "true" : "px-6",
+        "false" : "px-0"
+      }
+    },
+    "drawer": {
+      "overlay": "fixed inset-0 z-50 bg-overlay-mid",
+      "content" : {
+        "root" : "overflow-clip fixed font-primary z-50 w-full",
+        "wrapper" : "w-full h-full flex flex-col rounded-lg border border-neutral-subtle bg-layer-dialog overflow-clip shadow-2xl"
+      },
+      "header": "grid gap-0.5 text-left bg-layer-raised p-6 pr-14 sticky top-0 self-stretch",
+      "footer": "flex h-20 gap-4 bg-layer-raised items-center p-6 sticky bottom-0 w-full",
+      "title": "text-2xl font-semibold leading-none tracking-tight text-neutral-mid",
+      "description": "text-sm font-semibold text-neutral-subtle",
+      "footerAlign": {
+        "justify": "flex justify-between",
+        "end": "flex justify-end",
+        "start": "flex justify-start",
+        "stretch": "flex [&>*]:flex-1"
+      },
+      "close": "absolute right-4 top-4 z-51 ",
+      "body": "gap-6 flex flex-col h-full w-full overflow-y-auto text-neutral-mid max-h-[calc(100vh-160px)]",
+      "width" : {
+        "xs" : "max-w-sm",
+        "sm" : "max-w-sm",
+        "md" : "max-w-md",
+        "lg" : "max-w-lg",
+        "3xl" : "max-w-3xl",
+        "5xl" : "max-w-5xl",
+        "full" : "max-w-full",
+        "fit" : "max-w-fit"
+      },
+      "isSm" : "w-full",
+      "height" : {
+        "full" : "h-full",
+        "auto" : "h-auto",
+        "else" : "h-auto lg:h-full"
+      },
+      "side" : {
+        "left" : "left-0 bottom-0",
+        "right" : "right-0 bottom-0",
+        "bottom" : "bottom-0",
+        "top" : "top-0"
+      },
+      "lgSide" : {
+        "left" : "lg:left-0 lg:bottom-0 lg:top-auto lg:right-auto",
+        "right" : "lg:right-0 lg:bottom-0 lg:top-auto lg:left-auto",
+        "bottom" : "lg:bottom-0 lg:inset-x-auto lg:top-auto",
+        "top" : "lg:top-0 lg:inset-x-auto lg:bottom-auto"
+      },
+      "padding" : {
+        "true" : "px-6",
+        "false" : "px-0"
+      },
+      "portal" : {
+        "overlay" : "no-after",
+        "content" : "no_after p-2 max-h-screen"
+      }
+    },
+    "dropdown": {
+      "subTrigger": {
+        "root": "flex cursor-base select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none text-neutral-mid data-[highlighted]:bg-neutral-mid-hover data-[highlighted]:border-transparent data-[highlighted]:text-neutral-mid-hover",
+        "icon": "ml-auto"
+      },
+      "subContent": "font-primary z-30 min-w-[8rem] overflow-hidden rounded-md border bg-layer-popover p-1 text-popover-foreground shadow-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+      "content": "font-primary z-30 min-w-[8rem] gap-y-1 overflow-hidden border-neutral-subtle rounded-md border bg-layer-popover p-1 text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+      "item": "group relative leading-snug font-normal border-0 border-transparent gap-x-2 hover:bg-neutral-subtle-hover hover:border-transparent data-[disabled]:bg-transparent data-[disabled]:border-transparent text-neutral-mid hover:text-neutral-mid-hover data-[disabled]:text-disabled flex cursor-base select-none bg-transparent items-center rounded-sm px-2 py-1.5 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[highlighted]:bg-neutral-subtle-hover data-[highlighted]:border-transparent data-[highlighted]:text-neutral-mid-hover",
+      "destructive": {
+        "item": "group relative leading-snug font-normal border-0 border-transparent gap-x-2 hover:bg-neutral-subtle-hover hover:border-transparent data-[disabled]:bg-transparent data-[disabled]:border-transparent text-negative-mid hover:text-negative-mid data-[disabled]:text-negative-mid flex cursor-base select-none bg-transparent items-center rounded-sm px-2 py-1.5 text-sm outline-none transition-colors focus:bg-accent data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[highlighted]:bg-neutral-subtle-hover data-[highlighted]:border-transparent data-[highlighted]:text-negative-mid",
+        "shortcut": "ml-auto tracking-widest text-negative-subtle"
+      },
+      "checkbox": {
+        "item": "group relative leading-snug font-normal border-0 border-transparent gap-x-2 hover:bg-neutral-mid-hover hover:border-transparent data-[disabled]:bg-transparent data-[disabled]:border-transparent text-neutral-mid hover:text-neutral-mid-hover data-[disabled]:text-disabled flex cursor-base select-none bg-transparent items-center rounded-sm px-2 py-1.5 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[highlighted]:bg-neutral-mid-hover data-[highlighted]:border-transparent data-[highlighted]:text-neutral-mid-hover",
+        "icon": "h-4 w-4 shrink-0 justify-center"
+      },
+      "radio": {
+        "item": "relative flex cursor-base select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors data-[disabled]:pointer-events-none data-[disabled]:opacity-50 text-neutral-mid data-[highlighted]:bg-neutral-mid-hover data-[highlighted]:border-transparent data-[highlighted]:text-neutral-mid-hover",
+        "icon": "absolute left-2 flex h-3.5 w-3.5 items-center justify-center",
+        "indicator" : "fill-current"
+      },
+      "label": "bg-transparent border-transparent text-neutral-mid px-2 py-1.5 rounded-sm text-sm leading-snug font-semibold",
+      "separator": "-mx-1 my-1 bg-neutral-subtle h-px",
+      "inset": "pl-8",
+      "trigger" : "outline-none",
+      "shortcut": "ml-auto tracking-widest text-neutral-subtle group-hover:text-neutral-subtle-hover disabled:text-disabled"
+    },
+    "fileupload" : {
+      "root": "flex flex-col gap-4 items-center w-[343px] relative",
+      "uploader" : "w-full relative shadow-sm shadow-sm rounded-md",
+      "card": "p-4 w-full min-h-[144px] flex flex-col justify-center items-center gap-0 border-neutral-low bg-neutral-low shadow-sm",
+      "dragging": "bg-neutral-subtle",
+      "container" : "flex flex-col justify-center items-center gap-1 self-stretch relative",
+      "name": "text-center text-neutral-mid font-primary text-lg w-full truncate font-semibold h-[27px]",
+      "description": "text-center font-primary text-neutral-low text-sm w-full truncate font-medium h-[27px]",
+      "list" : {
+        "title" : "w-full flex justify-between items-center",
+        "root" : "w-full font-primary",
+        "icon" : {
+          "positive" : "[&>svg]:text-positive-mid",
+          "negative" : "[&>svg]:text-negative-mid"
+        }
+      },
+      "spinner" : "fill-icon-interactive-mid",
+      "button" : "absolute z-20 top-4 right-4"
+    },
+    "form" : {
+      "label" : {
+        "error" : "text-destructive font-primary"
+      },
+      "description" : "text-sm text-neutral-subtle font-primary",
+      "message" : "text-sm font-medium text-negative-mid font-primary",
+      "item" : {
+        "vertical" : "flex flex-col gap-2 w-full",
+        "horizontal" : "flex flex-row gap-2 items-center"
+      }
+    },
+    "input": {
+      "root": "font-primary focus:placeholder:text-neutral-subtle w-full text-neutral-mid file:disabled:placeholder:text-disabled gap-x-2 file:disabled:bg-disabled file:disabled:text-disabled file:disabled:border-disabled leading-relaxed font-medium font-primary text-sm disabled:opacity-100 h-10 file:h-full gap-x-2 px-3 py-2 bg-layer-control border-neutral-subtle placeholder:text-neutral-subtle rounded focus:ring border focus:ring-blue-600 focus:ring-2 focus:ring-offset-1 focus:bg-neutral-low focus-visible:outline-none focus:border-neutral-mid focus:text-neutral-mid disabled:bg-disabled disabled:border-neutral-mid file:border-0 disabled:placeholder:text-disabled disabled:text-disabled disabled:border-disabled file:bg-transparent file:border-neutral-subtle file:placeholder:text-neutral-subtle file:text-neutral-mid disabled:cursor-not-allowed [&::-webkit-search-cancel-button]:hidden [&::-webkit-search-decoration]:hidden shadow-sm",
+      "file": "text-neutral-subtle",
+      "container": "relative w-full text-neutral-mid",
+      "prefixIcon" : {
+        "root": "absolute left-3 top-1/2 transform -translate-y-1/2 disabled:opacity-100 disabled:cursor-not-allowed",
+        "props":{
+          "size": "4"
+        }
+      },
+      "prefix" : "absolute left-3 top-1/2 transform -translate-y-1/2 font-medium text-sm font-primary disabled:opacity-100 disabled:bg-disabled disabled:text-disabled disabled:cursor-not-allowed",
+      "prefixSlot" : "absolute left-3 top-1/2 transform -translate-y-1/2 disabled:opacity-100 disabled:bg-disabled disabled:text-disabled disabled:cursor-not-allowed",
+      "suffixIcon" : {
+        "root": "absolute right-3 top-1/2 transform -translate-y-1/2 disabled:opacity-100 disabled:cursor-not-allowed",
+        "props":{
+          "size": "4"
+        }
+      },
+      "suffix" : "absolute right-3 top-1/2 transform -translate-y-1/2 font-medium text-sm font-primary disabled:opacity-100 disabled:bg-disabled disabled:text-disabled disabled:cursor-not-allowed",
+      "suffixSlot" : "absolute right-3 top-1/2 transform -translate-y-1/2 disabled:opacity-100 disabled:bg-disabled disabled:text-disabled disabled:cursor-not-allowed",
+      "clearable" : {
+        "root": "absolute right-3 top-1/2 transform -translate-y-1/2 disabled:opacity-100 disabled:cursor-not-allowed cursor-pointer w-5 h-5 text-icon-interactive-mid hover:text-icon-interactive-mid active:text-icon-interactive-mid p-0 hover:bg-transparent active:bg-transparent",
+        "props":{
+          "size": "default"
+        }
+      },
+      "passwordIcon": "absolute right-3 cursor-pointer top-1/2 transform -translate-y-1/2 font-medium text-sm font-primary disabled:opacity-100 disabled:bg-disabled disabled:text-disabled disabled:cursor-not-allowed",
+      "clearableIconSuffix": "right-12"
+    },
+    "inputOTP": {
+      "root": "flex items-center gap-x-2 has-[:disabled]:opacity-50 font-primary",
+      "group": "flex items-center",
+      "input": "disabled:cursor-not-allowed",
+      "slot": {
+        "root": "p-3 font-medium relative flex h-10 w-10 bg-layer-control text-neutral-subtle items-center justify-center border-y border-r border-neutral-subtle text-sm transition-all first:rounded-l-md first:border-l last:rounded-r-md text-center shadow-sm",
+        "active": "z-10 ring-2"
+      },
+      "fakeCaret": {
+        "wrapper": "pointer-events-none absolute inset-0 flex items-center justify-center",
+        "root": "h-4 w-px animate-caret-blink bg-foreground duration-1000"
+      }
+    },
+    "label": {
+      "root": "gap-y-1 gap-x-0 text-xs font-medium disable:opacity-70 font-primary",
+      "main": "text-neutral-subtle disable:text-disabled",
+      "secondary": "text-neutral-subtle disable:text-disabled",
+      "disabled": "text-disabled"
+    },
+    "list" : {
+      "root": "gap-y-2 flex flex-col rounded-2xl font-primary text-neutral-mid",
+      "naked": {
+        "false" : "[&>*:last-child]:[&>*:last-child]:border-b-0 [&>*:first-child]:[&>*:last-child]:rounded-t-2xl [&>*:last-child]:[&>*:last-child]:rounded-b-2xl",
+        "true" : "[&>*:last-child]:bg-transparent border-0 [&>*:last-child]:border-transparent rounded-none [&>*:last-child>*]:px-0"
+      },
+      "content": "border border-neutral-subtle rounded-2xl bg-layer-raised",
+      "shadow": {
+        "true": "[&>*:last-child]:shadow-none",
+        "false": "[&>*:last-child]:shadow-sm"
+      },
+      "item": "p-3 px-4 gap-x-3 border-neutral-subtle border-b gap-y-0.5 min-h-14 flex items-center justify-between",
+      "interactive" : "hover:bg-brand-low cursor-pointer",
+      "wrapper" : "justify-between flex items-center gap-x-3 w-full",
+      "inverted" : "[&>*]:flex-col-reverse",
+      "attribute" : "flex flex-col gap-x-1 justify-center",
+      "first" : "text-base leading-normal font-medium text-neutral-mid text-right whitespace-nowrap",
+      "second" : "text-sm leading-normal font-medium text-neutral-low text-right whitespace-nowrap",
+      "itemTitle" : {
+        "root" : "flex flex-col",
+        "title" : "text-base leading-normal font-semibold text-neutral-mid",
+        "description" : "text-sm leading-normal font-medium text-neutral-low"
+      },
+      "title": {
+        "root": "text-brand-strong p-0",
+        "main": "text-base leading-normal font-semibold",
+        "secondary": "text-xs leading-normal font-medium",
+        "justify": "flex justify-between",
+        "end": "flex justify-end",
+        "start": "flex justify-start",
+        "stretch": "flex [&>*]:flex-1"
+      }
+    },
+    "navbar": {
+    "wrapper": "font-primary font-medium flex flex-col w-full z-20 absolute w-full top-0 left-1/2 transform -translate-x-1/2 text-sm text-neutral-mid px-6 bg-transparent lg:bg-transparent",
+    "root": "flex flex-col w-full items-center z-20",
+    "container": "flex w-full flex-col items-start z-20 justify-center flex-1",
+    "relaxed": "py-5 px-0 gap-4 gap-y-1",
+    "compact": "py-3 px-0 gap-2",
+    "content": "h-10 flex w-full relative gap-4",
+    "isTitle": "h-auto items-center",
+    "centerTitle": "flex-col items-center",
+    "external": "w-full hidden lg:flex",
+    "center": {
+      "root": "font-semibold h-full flex items-center max-w-full min-w-0 flex-[2] flex-col justify-center text-center",
+      "relaxed": "text-lg leading-normal",
+      "text": "line-clamp-1 w-full",
+      "compact": "text-lg"
+    },
+    "left": "flex flex-1 justify-start items-center h-full gap-2 shrink-0",
+    "right": "flex flex-1 justify-end items-center h-full shrink-0 gap-4"
+  },
+    "page": {
+      "root": "ff-page bg-layer-below lg:bg-layer-surface h-screen text-neutral-mid font-primary",
+      "focus": "bg-layer-below lg:bg-layer-below h-auto min-h-screen",
+      "focusOld": "bg-layer-surface lg:bg-layer-surface",
+      "inset": "bg-layer-below lg:bg-layer-below",
+      "focus-inset": "bg-layer-below lg:bg-layer-below",
+      "inset-2col": "bg-layer-below lg:bg-layer-below",
+      "inset-max-w": "bg-layer-below lg:bg-layer-below",
+      "inset-no-bg": "bg-neutral-subtle lg:bg-neutral-subtle",
+      "side": {
+        "root": "ff-pageSide px-4 py-4 lg:px-8 lg:py-8 pb-1 lg:pb-8 lg:border-neutral-subtle lg:border-r lg:w-80 w-full flex flex-col items-center lg:h-full h-fit lg:min-w-80",
+        "focus": "lg:py-10 lg:px-11 px-5 py-4 pb-4 lg:pb-10 gap-8 min-w-0 lg:min-w-0 lg:rounded-l-3xl rounded-t-3xl lg:rounded-t-none w-full lg:w-full bg-brand-low flex-col items-start overflow-hidden"
+      },
+      "container": {
+        "root": "ff-pageContainer flex flex-col items-center w-full h-full lg:h-full min-h-full lg:max-w-7xl bg-transparent",
+        "focus": "max-w-5xl min-h-0 h-full lg:h-fit",
+        "focusOld": "bg-transparent lg:bg-transparent max-w-[9999px] lg:max-w-7xl rounded-t-none rounded-b-none border-0 border-neutral-subtle",
+        "focus-inset": "max-w-[358px] lg:max-w-3xl lg:min-h-[536px] min-h-[576px] h-fit lg:h-fit min-h-none rounded-lg border border-neutral-subtle bg-layer-surface lg:bg-layer-surface shadow-sm relative overflow-hidden pb-18 lg:pb-[88px]",
+        "inset": "max-w-[9999px] lg:max-w-[9999px] rounded-lg border border-neutral-subtle bg-layer-surface lg:bg-layer-surface shadow-sm relative overflow-hidden shadow-sm pb-18 lg:pb-[88px]",
+        "inset-max-w": "max-w-[9999px] lg:max-w-[9999px] rounded-lg border border-neutral-subtle bg-layer-surface lg:bg-layer-surface shadow-sm relative overflow-hidden shadow-sm pb-18 lg:pb-[88px]",
+        "inset-2col": "max-w-[9999px] lg:max-w-[1216px] rounded-lg border lg:min-h-0 lg:max-h-[800px] border-neutral-subtle bg-layer-surface lg:bg-layer-surface shadow-sm relative overflow-hidden shadow-sm",
+        "inset-no-bg": "max-w-[9999px] lg:max-w-[1440px] bg-transparent lg:bg-transparent shadow-sm relative overflow-hidden shadow-sm"
+      },
+      "wrap": {
+        "root": "ff-pageWrap pt-16 pb-0 lg:pb-0 lg:pt-20 flex items-center flex-col self-stretch h-full bg-transparent lg:bg-transparent",
+        "focusOld": "pt-16 pb-28 lg:pt-24 lg:pb-28  h-full",
+        "focus": "lg:pt-0 pt-0 pb-0 lg:pb-0 min-h-screen ",
+        "focus-inset": "pt-16 pb-4 lg:pt-20 lg:pb-0 bg-transparent lg:bg-transparent",
+        "inset": "px-0 pb-0 pt-16 lg:pt-20 bg-transparent lg:bg-transparent",
+        "inset-max-w": "px-0 pb-0 pt-16 lg:pt-20 bg-transparent lg:bg-transparent",
+        "inset-2col": "px-0 py-0 lg:px-0 lg:py-0 bg-transparent lg:bg-transparent",
+        "inset-no-bg": "px-0 pb-0 pt-16 lg:pt-20 bg-transparent lg:bg-transparent"
+      },
+      "content": {
+        "root": "ff-pageContent flex gap-16 w-full self-stretch items-start h-full",
+        "focus": "lg:pt-0 pt-0 pb-0 lg:pb-0 border border-neutral-subtle overflow-hidden",
+        "focus-inset":"lg:gap-16 gap-0 justify-center items-start self-stretch w-full",
+        "focusOld": "justify-center",
+        "inset":"gap-16 self-stretch w-full",
+        "inset-max-w": "gap-16 self-stretch w-full justify-center overflow-x-auto lg:overflow-x-hidden",
+        "inset-2col": "lg:gap-16 gap-0 self-stretch w-full justify-center",
+        "inset-no-bg": "lg:gap-16 gap-0 self-stretch w-full items-start"
+      },
+      "main": {
+        "root": "ff-pageMain h-full w-full bg-transparent max-w-none gap-y-6 flex flex-col items-start lg:py-6 lg:px-6 px-4 py-4 max-w-[9999px] flex-1 self-stretch overflow-x-auto lg:overflow-x-hidden",
+        "focus": "lg:px-10 lg:py-10 px-4 ly-4 w-full flex-col justify-center items-start gap-0 lg:min-h-0",
+        "focusOld": "bg-transparent lg:bg-transparent border-transparent lg:border-transparent px-0 py-0 lg:px-0 lg:py-0 max-w-[9999px] lg:max-w-3xl",
+        "focus-inset": "lg:max-w-3xl max-w-[9999px] lg:py-6 lg:px-6 px-4 py-4 lg:gap-6 gap-4 bg-transparent items-start w-full",
+        "noPadding": "lg:px-0 lg:py-0 py-0 px-0",
+        "inset": "lg:min-h-[536px] min-h-[576px] max-w-[9999px] lg:py-6 lg:px-6 px-4 py-4 lg:gap-6 gap-4 bg-transparent lg:items-center items-start",
+        "inset-2col": "lg:min-h-[536px] min-h-[576px] max-w-[9999px] lg:flex-row flex-col-reverse lg:py-0 lg:px-0 px-0 py-0 lg:gap-0 gap-0 bg-transparent lg:items-start items-start",
+        "inset-no-bg": "lg:min-h-[536px] min-h-[576px] max-w-[9999px] lg:py-6 lg:px-6 px-4 py-4 lg:gap-6 gap-4 bg-transparent lg:items-center items-start",
+        "inset-max-w": "lg:min-h-[536px] min-h-[576px] lg:h-fit h-fit lg:max-w-3xl max-w-[9999px] self-stretch lg:py-6 lg:px-6 px-4 py-4 lg:gap-6 gap-4 bg-transparent lg:items-center items-start "
+      },
+      "inner": {
+        "root": "ff-pageInner flex flex-col items-center w-full h-full min-h-full self-stretch bg-layer-surface",
+        "focus": "lg:py-6 lg:px-6 px-2 py-2 h-full items-center justify-center min-h-screen bg-transparent",
+        "noPadding": "lg:px-0 lg:py-0 py-0 px-0",
+        "inset": "lg:px-6 px-4 pt-0 lg:pb-6 pb-4 bg-transparent",
+        "inset-max-w": "lg:px-6 px-4 pt-0 lg:pb-6 pb-4 bg-transparent",
+        "inset-2col": "lg:px-6 px-4 lg:pb-6 pb-6 lg:pt-6 pt-4 bg-transparent lg:justify-center",
+        "focus-inset": "lg:px-0 px-0 lg:pt-6 pt-2 lg:pb-12 pb-4 bg-transparent",
+        "inset-no-bg": "lg:px-0 px-0 pt-0 lg:pb-0 pb-0 bg-transparent"
+      }
+    },
+    "multiSelect": {
+      "trigger": "flex w-full items-center bg-layer-control h-auto min-h-10 max-h-auto p-3 px-4 justify-between [&_svg]:pointer-events-auto rounded font-normal",
+      "selected": "flex justify-between items-center w-full",
+      "wrapper": "flex flex-wrap items-center gap-2",
+      "optionIcon": "mr-2",
+      "controls": "flex items-center justify-between gap-2",
+      "separator": "flex min-h-6 h-full",
+      "noValue": "flex items-center justify-between w-full mx-auto",
+      "placeholder" : "text-sm text-muted-foreground mx-3",
+      "item": "cursor-pointer justify-normal gap-1",
+      "noClearable": "ml-2"
+    },
+    "pdfViewer": {
+      "root" : "w-full h-full font-primary",
+      "worker": {
+        "root" : "rpv-core__viewer flex h-full relative border",
+        "wrapper" : "w-full h-full"
+      },
+      "toolbar": {
+      "root" : "items-center rounded-sm bottom-6 flex left-1/2 p-1 absolute z-[1] bg-neutral-subtle translate-x-[-50%]",
+      "icon": {
+         "root":  "px-0 py-0.5",
+         "center":  "px-0 py-0.5 ml-auto"
+       }
+      },
+      "input": "w-[40px] mr-2",
+      "viewer": "flex-1 overflow-hidden"
+    },
+    "phoneInput": {
+      "trigger": {
+        "root": "",
+        "props": {
+          "size": "default"
+        }
+      }
+    },
+    "popover": {
+      "root": "z-30 font-primary w-72 rounded border gap-0 border-neutral-subtle bg-layer-popover text-neutral-mid shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 shadow-md",
+      "padding": {
+        "true": "p-4",
+        "false": "p-0"
+      },
+      "trigger": "rounded"
+    },
+    "progress": {
+      "root" : "relative h-2 w-full overflow-hidden rounded-full bg-neutral-subtle",
+      "indicator" : "h-full w-full rounded-full flex-1 bg-brand-mid transition-all"
+    },
+    "radiogroup": {
+      "groupe": "grid gap-2 font-primary text-neutral-mid",
+      "item": "aspect-square group h-6 w-6 bg-layer-control aria-checked:bg-neutral-low hover:bg-neutral-low-hover aria-checked:hover:bg-neutral-low-hover disabled:bg-disabled aria-checked:disabled:bg-disabled border-neutral-subtle aria-checked:border-info-mid hover:border-neutral-subtle-hover aria-checked:hover:border-info-mid-hover disabled:border-disabled aria-checked:disabled:border-disabled rounded-full border focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 shadow-sm",
+      "indicator": "flex items-center justify-center ",
+      "icon": "h-3.5 w-3.5 rounded-full",
+      "color" : {
+        "root": "text-info-mid",
+        "disabled": "text-disabled"
+      }
+    },
+    "radiogroupeField" : {
+      "root" : "flex gap-2 font-primary self-stretch p-px",
+      "disabled" : "opacity-50"
+    },
+    "segmented": {
+      "root": "relative",
+      "active": "[&>svg]:text-icon-interactive-mid",
+      "icon": "text-icon-interactive-mid"
+    },
+    "select": {
+      "trigger": "disabled:opacity-50 [&>span]:truncate disabled:cursor-not-allowed focus:outline-none flex w-full items-center justify-between font-primary h rounded p-3 border bg-layer-control disabled:bg-disabled border-neutral-subtle text-neutral-subtle text-sm leading-normal font-medium disabled:text-disabled shadow-sm h-10",
+      "scrollButton": "flex cursor-base items-center justify-center py-1",
+      "content": {
+        "root": "font-primary p-1 max-h-96 min-w-32 relative bg-neutral-low border-neutral-subtle gap-y-1 border rounded z-30 overflow-hidden data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 shadow-sm",
+        "popper": "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1"
+      },
+      "label": "text-sm leading-snug font-semibold bg-transparent border-transparent text-neutral-mid pl-8 pr-2 pt-1.5 pb-1.5",
+      "item": {
+        "root": "select-none focus:outline-none relative flex w-full items-center data-[disabled]:opacity-50 data-[disabled]:text-disabled rounded-sm pl-8 pr-2 pt-1.5 pb-1.5 font-normal text-sm leading-snug border-0 bg-transparent border-transparent hover:bg-neutral-low-hover hover:border-transparent data-[disabled]:bg-transparent data-[disabled]:border-transparent text-neutral-mid hover:text-neutral-mid-hover data-[highlighted]:text-neutral-mid-hover data-[highlighted]:bg-neutral-low-hover data-[highlighted]:border-transparent",
+        "icon": "absolute left-2 flex h-3.5 w-3.5 items-center justify-center"
+      },
+      "separator": "-mx-1 my-1 h-px bg-neutral-subtle rounded-full",
+      "viewport": "",
+      "group": "w-full",
+      "icon" : "opacity-50"
+    },
+    "separator": {
+      "container" : {
+        "root" : "flex gap-2 font-primary text-neutral-mid",
+        "horizontal" : "flex-row items-center w-full",
+        "vertical" : "flex-col items-center h-full"
+      },
+      "root": "bg-transparent border-neutral-subtler border-b text-neutral-mid rounded-full font-normal",
+      "vertical": "h-full w-[1px] border-b-0 border-l",
+      "horizontal": "h-[1px] w-full",
+      "padding" : {
+        "horizontal" : "py-4",
+        "vertical" : "px-4"
+      }
+    },
+    "sheet": {
+      "overlay": "fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
+      "content": {
+        "base": "fixed z-50 gap-4 bg-layer-below p-6 shadow-lg transition ease-in-out data-[state=closed]:duration-300 data-[state=open]:duration-500 data-[state=open]:animate-in data-[state=closed]:animate-out",
+        "variants": {
+          "top": "inset-x-0 top-0 border-b data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top",
+          "bottom": "inset-x-0 bottom-0 border-t data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom",
+          "left": "inset-y-0 left-0 h-full w-3/4 border-r data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left sm:max-w-sm",
+          "right": "inset-y-0 right-0 h-full w-3/4 border-l data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right sm:max-w-sm"
+        }
+      },
+      "closeButton": "absolute right-4 top-4 rounded-sm opacity-70 transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-neutral-subtle",
+      "header": "flex flex-col space-y-2 text-center sm:text-left",
+      "footer": "flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",
+      "title": "text-lg font-semibold text-neutral-mid",
+      "description": "text-sm text-neutral-subtle"
+    },
+    "sidebar": {
+    "sheet": {
+      "root": "w-[--sidebar-width] bg-layer-below p-0 text-sidebar-foreground [&>button]:hidden"
+    },
+    "provider": {
+      "wrapper": "group/sidebar-wrapper flex min-h-svh w-full has-[[data-variant=inset]]:bg-sidebar"
+    },
+    "root": {
+      "base": "flex h-full w-[--sidebar-width] flex-col bg-layer-below text-sidebar-foreground",
+      "props": {
+          "width": {
+            "root": "16rem",
+            "icon": "88px",
+            "mobile":"18rem"
+          },
+          "shortcut": ""
+        },
+      "container": "flex h-full w-full flex-col",
+      "default": "group peer hidden lg:block",
+      "wrapper": {
+        "base": "duration-200 relative h-svh w-[--sidebar-width] bg-transparent transition-[width] ease-linear",
+        "collapsibleOffcanvas": "group-data-[collapsible=offcanvas]:w-0",
+        "flipped": "group-data-[side=right]:rotate-180",
+        "variants": {
+          "floating": "group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)_+_theme(spacing.4))]",
+          "inset": "group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)_+_theme(spacing.4))]",
+          "default": "group-data-[collapsible=icon]:w-[--sidebar-width-icon]"
+        }
+      },
+      "fixed": {
+        "base": "duration-200 fixed inset-y-0 z-10 hidden h-svh w-[--sidebar-width] transition-[left,right,width] ease-linear :flex border-neutral-subtle",
+        "side": {
+          "left": "left-0 group-data-[collapsible=offcanvas]:left-[calc(var(--sidebar-width)*-1)]",
+          "right": "right-0 group-data-[collapsible=offcanvas]:right-[calc(var(--sidebar-width)*-1)]"
+        },
+        "variants": {
+          "floatingOrInset": "p-2 group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)_+_theme(spacing.4)_+2px)]",
+          "default": "group-data-[collapsible=icon]:w-[--sidebar-width-icon] group-data-[side=left]:border-r group-data-[side=right]:border-l"
+        },
+        "inner": "flex h-full w-full flex-col text-sidebar-foreground bg-layer-below group-data-[variant=floating]:rounded-lg group-data-[variant=floating]:border group-data-[variant=floating]:border-neutral-subtle group-data-[variant=floating]:shadow"
+      }
+    },
+    "rail": "absolute inset-y-0 z-20 hidden w-4 -translate-x-1/2 transition-all ease-linear after:absolute after:inset-y-0 after:left-1/2 after:w-[2px] hover:after:bg-neutral-low group-data-[side=left]:-right-4 group-data-[side=right]:left-0 sm:flex [[data-side=left]_&]:cursor-w-resize [[data-side=right]_&]:cursor-e-resize [[data-side=left][data-state=collapsed]_&]:cursor-e-resize [[data-side=right][data-state=collapsed]_&]:cursor-w-resize group-data-[collapsible=offcanvas]:translate-x-0 group-data-[collapsible=offcanvas]:after:left-full group-data-[collapsible=offcanvas]:hover:bg-sidebar [[data-side=left][data-collapsible=offcanvas]_&]:-right-2 [[data-side=right][data-collapsible=offcanvas]_&]:-left-2",
+    "trigger": "p-1 flex items-center border-neutral-subtle justify-center bg-layer-surface [&>svg]:text-icon-neutral-strong [&>svg]:size-4 [&>svg]:shrink-0",
+    "separator": "mx-2 w-auto bg-neutral-low",
+    "content": "flex min-h-0 flex-1 flex-col gap-3 overflow-auto group-data-[collapsible=icon]:overflow-hidden px-2 py-3 ",
+    "header": "flex flex-col gap-2 pt-6 px-6 pb-0",
+    "footer": "flex flex-col gap-2 px-4 py-4",
+    "input": "h-8 w-full bg-background shadow-none focus-visible:ring-2 focus-visible:ring-teal-600",
+    "inset": "relative flex min-h-svh flex-1 flex-col bg-background peer-data-[variant=inset]:min-h-[calc(100svh-theme(spacing.4))] lg:peer-data-[variant=inset]:m-2 lg:peer-data-[state=collapsed]:peer-data-[variant=inset]:ml-2 lg:peer-data-[variant=inset]:ml-0 lg:peer-data-[variant=inset]:rounded-xl lg:peer-data-[variant=inset]:shadow min-h-full relative overflow-hidden",
+    "group": {
+      "root": "relative flex w-full min-w-0 flex-col px-2 py-3",
+      "label": "duration-200 flex h-8 shrink-0 items-center font-primary rounded px-4 text-xs font-normal text-neutral-low outline-none transition-[margin,opa] ease-linear [&>svg]:text-icon-neutral-strong [&>svg]:size-4 [&>svg]:shrink-0 group-data-[collapsible=icon]:-mt-8 group-data-[collapsible=icon]:opacity-0",
+      "content": "w-full text-sm",
+      "action": "absolute right-3 top-3.5 flex aspect-square w-5 items-center justify-center rounded-md p-0 text-sidebar-foreground outline-none ring-teal-600 transition-transform hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0 after:absolute after:-inset-2 after:lg:hidden group-data-[collapsible=icon]:hidden"
+    },
+    "menu": {
+      "root": "flex w-full min-w-0 flex-col gap-2 py-2 px-2 ",
+      "item": "group/menu-item relative rounded font-primary font-medium",
+      "badge": "absolute right-1 flex h-5 min-w-5 items-center justify-center rounded-md px-1 text-xs font-medium tabular-nums text-sidebar-foreground select-none pointer-events-none peer-hover/menu-button:text-sidebar-accent-foreground peer-data-[active=true]/menu-button:text-sidebar-accent-foreground peer-data-[size=sm]/menu-button:top-1 peer-data-[size=default]/menu-button:top-1.5 peer-data-[size=lg]/menu-button:top-2.5 group-data-[collapsible=icon]:hidden",
+      "action": "absolute right-1 top-1.5 flex aspect-square w-5 items-center justify-center rounded-md p-0 text-sidebar-foreground outline-none ring-teal-600 transition-transform hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 peer-hover/menu-button:text-sidebar-accent-foreground after:absolute after:-inset-2 after:lg:hidden peer-data-[size=sm]/menu-button:top-1 peer-data-[size=default]/menu-button:top-1.5 peer-data-[size=lg]/menu-button:top-2.5 group-data-[collapsible=icon]:hidden",
+      "actionHover": "group-focus-within/menu-item:opacity-100 group-hover/menu-item:opacity-100 data-[state=open]:opacity-100 peer-data-[active=true]/menu-button:text-sidebar-accent-foreground lg:opacity-0",
+      "skeleton": {
+        "root": "rounded-md h-8 flex gap-2 px-2 items-center",
+        "icon": "size-4 rounded-md",
+        "text": "h-4 flex-1 max-w-[--skeleton-width]"
+      },
+      "button": {
+        "root": "peer/menu-button flex w-full items-center gap-2 overflow-hidden rounded py-2 px-3 text-left text-sm outline-none transition-[width,height,padding] focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 group-has-[[data-sidebar=menu-action]]/menu-item:pr-8 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-[active=true]:bg-sidebar-accent data-[active=true]:font-medium data-[active=true]:text-sidebar-accent-foreground data-[state=open]:hover:bg-sidebar-accent data-[state=open]: group-data-[collapsible=icon]:!size-8 group-data-[collapsible=icon]:!p-2 [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0 font-medium",
+        "variant": {
+          "default": "items-center gap-2 overflow-hidden rounded font-primary font-medium px-2 py-1.5 text-neutral-subtle aria-disabled:bg-transparent hover:text-neutral-strong-hover hover:bg-neutral-subtle-hover aria-expanded:bg-layer-control aria-expanded:text-neutral-strong-active [&>svg]:aria-expanded:text-icon-neutral-strong-active aria-disabled:[&>svg]:text-disabled aria-disabled:text-disabled [&>svg]:hover:text-icon-neutral-strong-hover [&>svg]:text-icon-neutral-subtle data-[active=true]:bg-layer-control [&>svg]:data-[active=true]:text-icon-neutral-strong-active  data-[active=true]:text-neutral-strong-active",
+          "outline": "bg-background shadow-[0_0_0_1px_hsl(var(--sidebar-border))] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground hover:shadow-[0_0_0_1px_hsl(var(--sidebar-accent))]"
+        },
+        "size": {
+          "default": "h-11 text-base",
+          "sm": "h-7 text-xs",
+          "lg": "h-12 text-sm p-0"
+        },
+        "defaultVariants": {
+          "variant": "default",
+          "size": "default"
+        }
+      },
+      "sub": {
+        "list": "mx-3.5 flex min-w-0 translate-x-px flex-col gap-1 px-2.5 py-0.5 group-data-[collapsible=icon]:hidden",
+        "button": "flex h-7 min-w-0 -translate-x-px items-center gap-2 overflow-hidden rounded font-primary font-medium px-3 py-2 text-neutral-subtle aria-disabled:bg-transparent hover:text-neutral-strong-hover hover:bg-neutral-subtle-hover focus-visible:ring-2 active:bg-layer-control active:text-neutral-strong-active active:[&>svg]:text-icon-neutral-strong-active aria-disabled:[&>svg]:text-disabled aria-disabled:text-disabled [&>svg]:hover:text-icon-neutral-strong-hover [&>svg]:text-icon-neutral-subtle data-[active=true]:bg-layer-control data-[active=true]:text-neutral-strong-active group-data-[collapsible=icon]:hidden",
+        "buttonSize": {
+          "sm": "text-xs",
+          "default": "text-base",
+          "md": "text-sm"
+        }
+      }
+    }
+  },
+    "skeleton": {
+      "root": "animate-pulse rounded-md bg-neutral-subtle"
+    },
+    "spinner" : "animate-spin",
+    "switch": {
+      "root": "peer p-0.5 inline-flex h-6 w-11 shrink-0 cursor-pointer items-center rounded-full border-0 border-transparent transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed data-[state=checked]:bg-interactive-mid data-[state=unchecked]:bg-neutral-strong disabled:data-[state=unchecked]:bg-disabled disabled:data-[state=checked]:bg-disabled",
+      "trigger": "border-transparent disabled:opacity-50 border-0 pointer-events-none block h-5 w-5 rounded-full data-[state=unchecked]:bg-layer-control data-[state=checked]:bg-layer-control shadow ring-0 transition-transform data-[state=checked]:translate-x-5 data-[state=unchecked]:translate-x-0"
+    },
+    "table": {
+      "root": "w-full overflow-clip caption-bottom text-sm bg-layer-control rounded font-primary text-neutral-mid",
+      "header": "[&_tr]:border-b h-12 bg-layer-control border-neutral-subtle w-full",
+      "body": "[&_tr:last-child]:border-0",
+      "footer": "border-t bg-layer-control font-medium [&>tr]:last:border-b-0",
+      "row": "items-center border-b [&>*:first-child]:pl-4 [&>*:last-child]:pr-4 border-neutral-subtle group transition-colors bg-layer-control data-[state=selected]:bg-neutral-low-active",
+      "head": " px-2 py-[10px] bg-transparent text-left align-middle font-medium text-neutral-low text-xs",
+      "cell": "truncate px-2 h-12 align-middle [&:has([role=checkbox])]:pr-0 font-medium text-neutral-mid text-sm",
+      "caption": "mt-4 text-sm text-neutral-subtle",
+      "container" : "w-full border border-neutral-subtle rounded overflow-x-auto max-w-full",
+      "empty" : "flex items-center justify-center py-10"
+    },
+    "tabs": {
+      "list": { 
+        "root": "inline-flex h-[34px] gap-1 items-center justify-center rounded-md p-0.5 font-primary bg-layer-control border border-neutral-low",
+        "line" : "bg-transparent p-0 rounded-none border-neutral-subtle border-none border-b gap-0 h-auto relative",
+        "indicator": "absolute bottom-0 h-[1px] z-10 bg-brand-mid transition-all duration-300 disabled:opacity-50",
+        "solidActive": "absolute transition-all duration-300 disabled:opacity-50 h-8 rounded-md bottom-auto bg-brand-low left-0 shadow"
+      },
+      "trigger": {
+        "root": "gap-1 font-sm leading-snug font-medium inline-flex items-center justify-center whitespace-nowrap bg-transparent transition-all disabled:cursor-not-allowed disabled:opacity-50 disabled:text-disabled",
+        "solid": "font-primary text-sm font-semibold [&>svg]:text-icon-neutral-low rounded px-3 py-1.5 text-neutral-low data-[state=active]:text-onbrand-low data-[state=active]:[&>svg]:text-icon-onbrand-low z-0",
+        "line": "text-neutral-subtle text-base font-semibold px-4 py-2 rounded-none bg-transparent z-0 data-[state=active]:text-brand-mid data-[state=active]:[&>svg]:text-icon-brand-mid [&>svg]:text-icon-neutral-low border-neutral-subtle border-b font-semibold"
+      },
+      "content": "font-primary mt-2 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2"
+    },
+    "textarea": {
+      "root": "flex gap-y-1.5 w-full leading-snug font-medium font-primary rounded border border-neutral-subtle bg-layer-control focus-visible:border-interactive-mid focus-visible:bg-neutral-subtle px-3 py-2 text-sm placeholder:text-neutral-subtle focus-visible:placeholder:text-neutral-subtle text-neutral-mid focus-visible:outline-none  disabled:cursor-not-allowed disabled:opacity-50 disabled:bg-disabled disabled:border-disabled disabled:text-disabled shadow-sm"
+    },
+    "toast": {
+      "variant": {
+        "root": "flex w-full font-primary p-4 items-center gap-2 rounded border shadow-lg group",
+        "neutral": "bg-neutral-subtle border-transparent ",
+        "destructive": "bg-negative-low border-transparent ",
+        "warning": "bg-warning-low border-warning-subtle ",
+        "success": "bg-positive-low border-positive-subtle",
+        "info": "bg-info-low border-info-subtle"
+      },
+      "description" : {
+        "variant": {
+          "root": "leading-4 text-xs font-normal",
+          "neutral": "!text-neutral-subtle flex",
+          "destructive": "!text-onnegative-low",
+          "warning": "!text-neutral-subtle",
+          "success": "!text-neutral-subtle",
+          "info": "!text-neutral-subtle"
+        }
+      },
+      "title" : {
+        "variant": {
+          "root": "text-sm leading-4 font-medium",
+          "neutral": "text-neutral-mid",
+          "destructive": "text-onnegative-low",
+          "warning": "text-onwarning-low",
+          "success": "text-onpositive-low",
+          "info": "text-oninfo-low"
+        }
+      },
+      "icon" : {
+        "variant": {
+          "neutral": "text-icon-neutral-mid",
+          "destructive": "text-icon-onnegative-low",
+          "warning": "text-icon-onwarning-low",
+          "success": "text-icon-onpositive-low",
+          "info": "text-icon-oninfo-low"
+        }
+      },
+      "root" : "lg:max-w-md justify-end flex",
+      "content" : "flex gap-1 items-start flex-col flex-1"
+    },
+    "tooltip": {
+      "content": "z-30 overflow-hidden rounded-md font-normal font-primary border gap-1 bg-inverse-mid px-3 py-1.5 text-sm text-inverse-mid animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2"
+    }
+  }