@bitrix24/b24ui-nuxt 2.4.0 → 2.4.2

package/dist/shared/{b24ui-nuxt.DstlkmYO.mjs → b24ui-nuxt.C-GSAtA1.mjs}

@@ -8,7 +8,7 @@ import { globSync } from 'tinyglobby';
 import { defuFn } from 'defu';
 
 const name = "@bitrix24/b24ui-nuxt";
-const version = "2.4.0";
+const version = "2.4.2";
 
 function getDefaultConfig(theme) {
   return {
@@ -24,6 +24,7 @@ const defaultOptions = {
   colorMode: true,
   colorModeInitialValue: "light",
   colorModeTypeLight: "light",
+  colorModeStorageKey: "vueuse-color-scheme",
   version,
   mdc: true,
   content: false
@@ -2424,11 +2425,11 @@ const commandPalette = {
     root: [
       "flex flex-col",
       "min-h-0 min-w-0",
-      "divide-y divide-(--ui-color-design-tinted-na-stroke)"
+      "divide-y divide-(--ui-color-divider-default)"
     ].join(" "),
     input: "",
     close: "",
-    back: "p-0",
+    back: "p-0 -ms-1.5 me-1",
     content: "relative overflow-hidden flex flex-col",
     footer: "p-1",
     viewport: [
@@ -2488,7 +2489,6 @@ const commandPalette = {
       },
       false: {
         viewport: ""
-        // divide-y divide-(--ui-color-design-tinted-na-stroke)
       }
     },
     size: {
@@ -2853,12 +2853,12 @@ const dashboardGroup = {
 
 const dashboardNavbar = {
   slots: {
-    root: "h-(--b24ui-header-height) shrink-0 flex items-center justify-between border-b border-(--ui-color-divider-default) px-4 sm:px-6 gap-1.5",
+    root: "h-(--b24ui-header-height) shrink-0 flex items-center justify-between ps-2 pe-4 lg:ps-4 lg:pe-4 gap-1.5",
     left: "flex items-center gap-1.5 min-w-0",
     icon: "shrink-0 size-5 self-center me-1.5",
-    title: "flex items-center gap-1.5 font-(--ui-font-weight-semi-bold) text-(--b24ui-typography-label-color) truncate",
+    title: "flex items-center gap-1.5 text-[length:25px] bitrix-mobile:text-[length:18px] font-medium text-(--ui-color-base-1) truncate",
     center: "hidden lg:flex",
-    right: "flex items-center shrink-0 gap-1.5",
+    right: "flex items-center shrink-0 gap-3",
     toggle: ""
   },
   variants: {
@@ -2875,8 +2875,8 @@ const dashboardNavbar = {
 
 const dashboardPanel = {
   slots: {
-    root: "relative flex flex-col min-w-0 min-h-svh lg:not-last:border-e lg:not-last:border-(--ui-color-divider-default) shrink-0",
-    body: "flex flex-col gap-4 sm:gap-6 flex-1 overflow-y-auto p-4 sm:p-6 scrollbar-thin",
+    root: "relative flex flex-col min-w-0 min-h-svh lg:not-last:border-e lg:not-last:border-e-0 lg:not-last:border-(--ui-color-divider-default) shrink-0",
+    body: "flex flex-col gap-4 sm:gap-6 flex-1 overflow-y-auto sm:p-4 sm:pt-0 scrollbar-thin",
     handle: ""
   },
   variants: {
@@ -2940,10 +2940,18 @@ const dashboardSearchButton = {
 
 const dashboardSidebar = {
   slots: {
-    root: "relative hidden lg:flex flex-col min-h-svh min-w-16 w-(--width) shrink-0",
-    header: "h-(--b24ui-header-height) shrink-0 flex items-center gap-1.5 px-4",
-    body: "flex flex-col gap-4 flex-1 overflow-y-auto py-2 scrollbar-thin scrollbar-transparent",
-    footer: "shrink-0 flex items-center gap-1.5 px-4 py-2",
+    root: [
+      "relative hidden lg:flex flex-col min-h-svh min-w-16 w-(--width) shrink-0",
+      "backdrop-blur-sm bg-(--ui-color-bg-content-primary)/20 light:bg-transparent dark:bg-(--ui-color-bg-content-primary)/70",
+      "light:bg-transparent light:[--leftmenu-group-stroke:var(--ui-color-base-30)]"
+    ].join(" "),
+    header: "h-(--b24ui-header-height) shrink-0 flex items-center gap-1.5 ps-4 pe-4",
+    body: "flex flex-col gap-4 flex-1 overflow-y-auto ps-4 pe-4 py-2 scrollbar-thin scrollbar-transparent",
+    footer: [
+      "shrink-0 flex items-center gap-1.5 ps-4 pe-4 py-2",
+      "lg:border-t lg:border-(--ui-color-divider-default)",
+      "light:lg:border-(--ui-color-base-30)"
+    ].join(" "),
     toggle: "",
     handle: "",
     content: "lg:hidden",
@@ -2959,7 +2967,7 @@ const dashboardSidebar = {
     },
     side: {
       left: {
-        root: "border-e border-(--ui-color-divider-default)"
+        root: "border-e border-e-0 border-(--ui-color-divider-accent)"
       },
       right: {
         root: ""
@@ -2998,7 +3006,7 @@ const dashboardSidebarToggle = {
 
 const dashboardToolbar = {
   slots: {
-    root: "shrink-0 flex items-center justify-between border-b border-(--ui-color-divider-default) px-4 sm:px-6 gap-1.5 overflow-x-auto min-h-[49px]",
+    root: "shrink-0 flex items-center justify-between border-0 px-4 gap-1.5 overflow-x-auto min-h-[49px]",
     left: "flex items-center gap-1.5",
     right: "flex items-center gap-1.5"
   }
@@ -3258,56 +3266,65 @@ const dropdownMenu = {
       "font-[family-name:var(--ui-font-family-primary)]",
       "relative",
       "isolate",
-      "px-0 py-(--menu-popup-padding)",
+      "px-0 py-(--menu-popup-padding) bitrix-mobile:py-0!",
       "pointer-events-auto"
     ].join(" "),
     viewport: [
       "relative",
       "w-full max-h-[40vh] min-w-[192px]",
       "overflow-x-hidden overflow-y-auto scrollbar-thin"
-      // scrollbar-transparent
     ].join(" "),
     arrow: "fill-(--ui-color-bg-content-primary)",
-    // for content bottom|top::start -> ml-[12px]
     group: "grid",
-    // p-1 isolate
     label: [
       "w-full h-(--popup-window-delimiter-section-height)",
-      // min-w-[195px]
+      "bitrix-mobile:h-[27px]",
       "px-[18px] mt-(--menu-item-block-stack-space)",
+      "bitrix-mobile:pe-0 bitrix-mobile:mt-0 bitrix-mobile:-mb-[12px]",
       "flex flex-row rtl:flex-row-reverse items-center",
       "select-none outline-none whitespace-nowrap",
       "text-start",
       "text-(length:--ui-size-sm)",
-      "text-(--b24ui-typography-legend-color)",
+      "text-(--ui-color-base-3)",
+      'bitrix-mobile:[&_[data-slot="itemLabel"]]:text-(--ui-color-base-5)',
       "font-(--ui-font-weight-normal)",
       "after:ms-[10px] after:block after:flex-1 after:min-w-[15px] after:h-px after:bg-(--ui-color-divider-vibrant-default)"
     ].join(" "),
-    separator: "my-[8px] mx-[18px] h-[1px] bg-(--ui-color-divider-vibrant-default)",
+    separator: [
+      "bg-(--ui-color-divider-vibrant-default)",
+      "my-2 mx-4.5 h-px",
+      "bitrix-mobile:my-0 bitrix-mobile:mx-0 bitrix-mobile:h-1.5"
+    ].join(" "),
     item: [
       "group",
       "w-full h-[36px]",
-      // min-w-[195px]
-      "px-[18px] mt-(--menu-item-block-stack-space)",
+      "bitrix-mobile:h-[42px]",
+      "px-4.5 pe-2 mt-(--menu-item-block-stack-space)",
+      "bitrix-mobile:mt-0",
       "relative",
-      "flex flex-row rtl:flex-row-reverse items-center",
+      "flex flex-row rtl:flex-row-reverse items-center gap-2",
       "select-none outline-none whitespace-nowrap",
       "cursor-pointer",
       "data-disabled:cursor-not-allowed data-disabled:opacity-30",
       "text-start",
       "text-(length:--ui-font-size-md)",
-      "text-(--b24ui-typography-legend-color) hover:text-(--b24ui-typography-label-color)",
-      "data-highlighted:text-(--b24ui-typography-label-color)",
-      "data-[state=open]:text-(--b24ui-typography-label-color)",
+      "text-(--ui-color-base-1)",
+      "hover:text-(--ui-color-base-1)",
+      "data-highlighted:text-(--ui-color-base-1)",
+      "data-[state=open]:text-(--ui-color-base-1)",
       "hover:bg-(--ui-color-divider-optical-1-alt)",
       "data-highlighted:bg-(--ui-color-divider-optical-1-alt)",
       "data-[state=open]:bg-(--ui-color-divider-optical-1-alt)",
-      "transition-colors"
+      "bitrix-mobile:data-[state=open]:bg-(--ui-color-bg-state-hover-default)",
+      "transition-colors",
+      'bitrix-mobile:[[data-slot="item"]+&]:border-t',
+      "bitrix-mobile:border-t-(--ui-color-divider-vibrant-default)",
+      "bitrix-mobile:data-highlighted:bg-(--ui-color-bg-state-hover-default)"
     ].join(" "),
     itemLeadingIcon: [
       "shrink-0",
-      "size-[18px]",
-      "text-(--ui-color-design-plain-content-icon-secondary)",
+      "size-[25px]",
+      "text-(--ui-color-base-5)",
       "group-data-highlighted:text-(--ui-color-accent-main-primary)",
       "group-data-[state=open]:text-(--ui-color-accent-main-primary)",
       "group-data-[state=checked]:text-(--ui-color-accent-main-primary)",
@@ -3318,7 +3335,7 @@ const dropdownMenu = {
     itemLeadingAvatarSize: "2xs",
     // @memo this wrong
     itemTrailing: "ml-auto rtl:ml-0 rtl:mr-auto inline-flex gap-1.5 items-center",
-    itemTrailingIcon: "shrink-0 size-[24px] text-(--ui-color-accent-main-primary)",
+    itemTrailingIcon: "shrink-0 size-[25px] text-(--ui-color-accent-main-primary)",
     itemTrailingKbds: "shrink-0 hidden lg:inline-flex items-center gap-0.5",
     itemTrailingKbdsSize: "md",
     itemWrapper: "flex-1 flex flex-col text-start min-w-0",
@@ -3327,7 +3344,7 @@ const dropdownMenu = {
       "group-data-[state=checked]:text-(--ui-color-accent-main-primary)"
     ].join(" "),
     itemDescription: "max-w-[240px] truncate -mt-[6px] text-(--b24ui-typography-description-color) text-(length:--ui-font-size-sm)",
-    itemLabelExternalIcon: "inline-block size-[16px] text-(--ui-color-design-plain-content-icon-secondary)"
+    itemLabelExternalIcon: "inline-block size-[25px] text-(--ui-color-base-5)"
   },
   variants: {
     color: {
@@ -3336,7 +3353,7 @@ const dropdownMenu = {
       "air-primary-alert": { item: "style-filled-alert" },
       "air-primary-copilot": { item: "style-filled-copilot" },
       "air-primary-warning": { item: "style-filled-warning" },
-      // @deprecate ////
+      /* @deprecate This rule is deprecated and will be removed in version 3.0.0 */
       "default": { item: "style-old-default" },
       "danger": { item: "style-old-danger" },
       "success": { item: "style-old-success" },
@@ -3401,6 +3418,7 @@ const dropdownMenu = {
       active: true,
       class: ""
     },
+    /* @deprecate This rule is deprecated and will be removed in version 3.0.0 */
     {
       color: ["danger", "success", "warning", "primary", "secondary", "collab", "ai"],
       active: false,
@@ -3413,6 +3431,7 @@ const dropdownMenu = {
         ].join(" ")
       }
     },
+    /* @deprecate This rule is deprecated and will be removed in version 3.0.0 */
     {
       color: ["danger", "success", "warning", "primary", "secondary", "collab", "ai"],
       active: true,
@@ -4166,17 +4185,15 @@ const header = {
 const input = {
   slots: {
     root: "isolate relative inline-flex items-center",
-    // remove ? w-full -> see select
     base: [
       "px-3",
       "w-full py-0 border-0 focus:outline-none",
       "disabled:cursor-not-allowed",
-      "disabled:pointer-events-none",
+      "disabled:pointer-events-auto",
       "disabled:select-none",
       "disabled:opacity-30",
       "disabled:resize-none",
-      "appearance-none transition duration-300 ease-linear",
-      // transition-colors
+      "appearance-none transition-colors duration-300 ease-linear",
       "text-(--ui-color-base-1)",
       "style-blurred-bg-input",
       "placeholder:text-(--ui-color-design-plain-na-content-secondary)",
@@ -4266,7 +4283,7 @@ const input = {
       "air-primary-alert": { base: "style-filled-alert" },
       "air-primary-copilot": { base: "style-filled-copilot" },
       "air-primary-warning": { base: "style-filled-warning" },
-      // @deprecate ////
+      // @deprecate This rule is deprecated and will be removed in version `3.0.0` ////
       "default": { base: "style-old-default" },
       "danger": { base: "style-old-danger" },
       "success": { base: "style-old-success" },
@@ -4345,7 +4362,7 @@ const input = {
       class: {
         base: [
           "focus-visible:border-(--b24ui-border-color)",
-          "hover:border-(--b24ui-border-color)",
+          "hover:not-disabled:not-data-disabled:border-(--b24ui-border-color)",
           "data-[state=open]:border-(--b24ui-border-color)"
         ].join(" ")
       }
@@ -4496,6 +4513,23 @@ const input = {
         trailingIcon: "size-[21px]"
       }
     },
+    {
+      loading: true,
+      leading: true,
+      noPadding: true,
+      class: {
+        base: "ps-[34px]"
+      }
+    },
+    {
+      loading: true,
+      leading: false,
+      trailing: true,
+      noPadding: true,
+      class: {
+        base: "pe-[34px]"
+      }
+    },
     // endregion ////
     // region fieldGroup ////
     {
@@ -4583,7 +4617,7 @@ const inputDate = () => {
         "data-[segment=literal]:text-(--ui-color-base-6)",
         "data-invalid:text-(--ui-color-accent-main-alert)",
         "data-disabled:cursor-not-allowed",
-        "data-disabled:pointer-events-none",
+        "data-disabled:pointer-events-auto",
         "data-disabled:select-none",
         "data-disabled:opacity-30",
         "transition-colors",
@@ -4630,12 +4664,11 @@ const inputMenu = () => {
       base: [
         "w-full py-0 border-0 focus:outline-none",
         "disabled:cursor-not-allowed",
-        "disabled:pointer-events-none",
+        "disabled:pointer-events-auto",
         "disabled:select-none",
         "disabled:opacity-30",
         "disabled:resize-none",
-        "appearance-none transition duration-300 ease-linear transition-colors",
-        // transition-colors
+        "appearance-none transition-colors duration-300 ease-linear",
         "text-(--ui-color-base-1)",
         "style-blurred-bg-input",
         "hover:text-(--ui-color-base-1)",
@@ -4655,7 +4688,6 @@ const inputMenu = () => {
       trailingClear: "p-0",
       content: [
         "base-mode",
-        // w-(--reka-combobox-trigger-width)
         "bg-(--ui-color-bg-content-primary)",
         "shadow-(--popup-window-box-shadow)",
         "rounded-(--ui-border-radius-xl) will-change-[opacity]",
@@ -4672,14 +4704,11 @@ const inputMenu = () => {
         "scroll-py-1",
         "w-[240px] max-h-[40vh]",
         "overflow-x-hidden overflow-y-auto scrollbar-thin"
-        // scrollbar-transparent
       ].join(" "),
       arrow: "fill-(--ui-color-bg-content-primary)",
-      // for content bottom|top::start -> ml-[12px]
       group: "grid",
       empty: [
         "h-(--popup-window-delimiter-section-height)",
-        // 'mt-(--menu-item-block-stack-space)',
         "py-[8px]",
         "select-none outline-none whitespace-nowrap",
         "text-center",
@@ -4759,7 +4788,8 @@ const inputMenu = () => {
       tagsItemDelete: [
         "cursor-pointer",
         "inline-flex items-center",
-        "disabled:pointer-events-none",
+        "disabled:cursor-not-allowed",
+        "disabled:pointer-events-auto",
         "text-(--b24ui-icon-color-secondary)",
         "hover:text-(--b24ui-icon-color-secondary-hover)",
         "transition-none"
@@ -4774,13 +4804,11 @@ const inputMenu = () => {
         },
         false: {
           viewport: ""
-          // divide-y divide-(--ui-color-design-tinted-na-stroke)
         }
       },
       addNew: {
         true: {
           group: "",
-          // p-0 isolate -m-px
           item: [
             "text-(--b24ui-typography-legend-color)",
             "data-highlighted:not-data-disabled:text-(--b24ui-typography-label-color)",
@@ -4812,7 +4840,7 @@ const inputMenu = () => {
             "placeholder:text-(--ui-color-design-plain-na-content-secondary)",
             "focus:outline-none",
             "disabled:cursor-not-allowed",
-            "disabled:pointer-events-none",
+            "disabled:pointer-events-auto",
             "disabled:select-none",
             "disabled:opacity-30",
             "focus:ring-0 focus-visible:ring-0"
@@ -4824,7 +4852,7 @@ const inputMenu = () => {
             "placeholder:text-(--ui-color-design-plain-na-content-secondary)",
             "focus:outline-none",
             "disabled:cursor-not-allowed",
-            "disabled:pointer-events-none",
+            "disabled:pointer-events-auto",
             "disabled:select-none",
             "disabled:opacity-30"
           ].join(" ")
@@ -4929,6 +4957,7 @@ const inputMenu = () => {
         "air-primary-alert": { item: "style-filled-alert" },
         "air-primary-copilot": { item: "style-filled-copilot" },
         "air-primary-warning": { item: "style-filled-warning" },
+        // @deprecate This rule is deprecated and will be removed in version `3.0.0` ////
         "default": { item: "style-old-default" },
         "danger": { item: "style-old-danger" },
         "success": { item: "style-old-success" },
@@ -4940,7 +4969,6 @@ const inputMenu = () => {
       }
     },
     compoundVariants: [
-      // 'has-focus-visible:ring-1 has-focus-visible:ring-red-500'
       // from dropdown-menu
       {
         colorItem: ["air-primary", "air-primary-success", "air-primary-alert", "air-primary-copilot", "air-primary-warning"],
@@ -4976,6 +5004,7 @@ const inputMenu = () => {
         active: true,
         class: ""
       },
+      // @deprecate This rule is deprecated and will be removed in version `3.0.0` ////
       {
         colorItem: ["danger", "success", "warning", "primary", "secondary", "collab", "ai"],
         active: false,
@@ -4988,6 +5017,7 @@ const inputMenu = () => {
           ].join(" ")
         }
       },
+      // @deprecate This rule is deprecated and will be removed in version `3.0.0` ////
       {
         colorItem: ["danger", "success", "warning", "primary", "secondary", "collab", "ai"],
         active: true,
@@ -5044,11 +5074,11 @@ const inputNumber = () => {
       base: [
         "w-full py-0 border-0 focus:outline-none",
         "disabled:cursor-not-allowed",
-        "disabled:pointer-events-none",
+        "disabled:pointer-events-auto",
+        "disabled:select-none",
         "disabled:opacity-30",
         "disabled:resize-none",
-        "appearance-none transition duration-300 ease-linear",
-        // transition-colors
+        "appearance-none transition-colors duration-300 ease-linear",
         "text-(--ui-color-base-1)",
         "style-blurred-bg-input",
         "placeholder:text-(--ui-color-design-plain-na-content-secondary)",
@@ -5079,7 +5109,7 @@ const inputNumber = () => {
         "air-primary-alert": { base: "style-filled-alert" },
         "air-primary-copilot": { base: "style-filled-copilot" },
         "air-primary-warning": { base: "style-filled-warning" },
-        // @deprecate ////
+        // @deprecate This rule is deprecated and will be removed in version `3.0.0` ////
         "default": { base: "style-old-default" },
         "danger": { base: "style-old-danger" },
         "success": { base: "style-old-success" },
@@ -5089,10 +5119,6 @@ const inputNumber = () => {
         "collab": { base: "style-old-collab" },
         "ai": { base: "style-old-ai" }
       },
-      /**
-       * @memo now get from Badge
-       */
-      // tagColor: {},
       rounded: {
         ...input$1.variants.rounded
       },
@@ -5145,7 +5171,7 @@ const inputNumber = () => {
             "focus-visible:ring-1",
             "focus-visible:ring-inset",
             "focus-visible:ring-(--b24ui-border-color)",
-            "hover:ring-1 hover:ring-inset hover:ring-(--b24ui-border-color)",
+            "hover:not-disabled:not-data-disabled:ring-1 hover:not-disabled:not-data-disabled:ring-inset hover:not-disabled:not-data-disabled:ring-(--b24ui-border-color)",
             "data-[state=open]:ring-1 data-[state=open]:ring-inset data-[state=open]:ring-(--b24ui-border-color)"
           ].join(" ")
         }
@@ -5474,12 +5500,11 @@ const inputTags = () => {
       base: [
         "border-0 focus:outline-none",
         "disabled:cursor-not-allowed",
-        "disabled:pointer-events-none",
+        "disabled:pointer-events-auto",
         "disabled:select-none",
         "disabled:opacity-30",
         "disabled:resize-none",
-        "appearance-none transition duration-300 ease-linear transition-colors",
-        // transition-colors
+        "appearance-none transition-colors duration-300 ease-linear",
         "text-(--ui-color-base-1)",
         "style-blurred-bg-input",
         "hover:text-(--ui-color-base-1)",
@@ -5497,8 +5522,9 @@ const inputTags = () => {
         "leading-(--main-ui-square-item-height)",
         "font-[family-name:var(--ui-font-family-primary)] font-(--ui-font-weight-regular)",
         "inline-flex items-center gap-1",
-        "data-disabled:cursor-not-allowed data-disabled:opacity-30",
-        "data-disabled:pointer-events-none",
+        "data-disabled:cursor-not-allowed",
+        "data-disabled:opacity-30",
+        "data-disabled:pointer-events-auto",
         "data-disabled:select-none",
         "text-(--ui-color-design-tinted-content)",
         "bg-(--ui-color-design-tinted-bg-alt)"
@@ -5509,7 +5535,8 @@ const inputTags = () => {
       itemDelete: [
         "cursor-pointer",
         "inline-flex items-center",
-        "disabled:pointer-events-none",
+        "disabled:cursor-not-allowed",
+        "disabled:pointer-events-auto",
         "disabled:select-none",
         "text-(--b24ui-icon-color-secondary)",
         "hover:text-(--b24ui-icon-color-secondary-hover)",
@@ -5524,7 +5551,7 @@ const inputTags = () => {
         "placeholder:text-(--ui-color-design-plain-na-content-secondary)",
         "focus:outline-none",
         "disabled:cursor-not-allowed",
-        "disabled:pointer-events-none",
+        "disabled:pointer-events-auto",
         "disabled:select-none",
         "disabled:opacity-30",
         "focus:ring-0",
@@ -5670,7 +5697,7 @@ const inputTime = () => {
         "data-[segment=literal]:text-(--ui-color-base-6)",
         "data-invalid:text-(--ui-color-accent-main-alert)",
         "data-disabled:cursor-not-allowed",
-        "data-disabled:pointer-events-none",
+        "data-disabled:pointer-events-auto",
         "data-disabled:select-none",
         "data-disabled:opacity-30",
         "data-disabled:resize-none",
@@ -5907,7 +5934,7 @@ const navigationMenu = {
     list: "isolate min-w-0",
     label: [
       "w-full h-[22px] overflow-hidden mt-[10px]",
-      "opacity-70 text-(length:--ui-font-size-sm)"
+      "opacity-70 text-legend text-(length:--ui-font-size-sm)"
     ].join(" "),
     item: "min-w-0",
     link: [
@@ -6005,7 +6032,11 @@ const navigationMenu = {
           "menu-item-horizontal",
           "h-[32px] min-h-[32px]",
           "px-[10px]",
-          "border border-(--menu-item-background) hover:border-(--ui-color-design-plain-na-focused-stroke) data-[state=open]:bg-(--ui-color-design-plain-na-focused-stroke)"
+          "leading-7",
+          "border border-(--menu-item-background) hover:border-(--ui-color-design-plain-na-focused-stroke) data-[state=open]:bg-(--ui-color-design-plain-na-focused-stroke)",
+          "bitrix-mobile:px-3",
+          "bitrix-mobile:h-[34px] bitrix-mobile:min-h-[34px]",
+          "bitrix-mobile:text-(--ui-color-base-4) bitrix-mobile:border-(--ui-color-base-7)"
         ].join(" "),
         linkTrailingIcon: "size-[16px]",
         linkLeadingBadge: "-top-[6px] -right-[14px] -translate-x-1/2",
@@ -6025,7 +6056,8 @@ const navigationMenu = {
         content: "absolute top-0 left-0 w-full max-h-[70vh] overflow-y-auto scrollbar-thin scrollbar-transparent"
       },
       vertical: {
-        root: "flex-col w-full ps-(--menu-items-block-padding-x) rtl:pe-(--menu-items-block-padding-x)",
+        root: "flex-col w-full ps-0 pe-0 rtl:pe-0 rtl:ps-0",
+        // ps-(--menu-items-block-padding-x) rtl:pe-(--menu-items-block-padding-x)
         list: "flex flex-col",
         item: [
           "mt-(--menu-item-block-stack-space)",
@@ -6071,9 +6103,14 @@ const navigationMenu = {
     },
     active: {
       true: {
+        /**
+         * @memo Special color for `light` mode - see b24.settings.
+         * @see src/runtime/air-design-tokens/components/navigation-menu.css
+         */
+        link: "light:font-semibold",
         childLink: [
-          "text-(--ui-color-accent-main-primary) hover:text-(--ui-color-accent-main-primary)"
-          // [#0075ff]
+          "text-(--ui-color-accent-main-primary)",
+          "hover:text-(--ui-color-accent-main-primary)"
         ].join(" "),
         childLinkIcon: "text-(--ui-color-accent-main-primary)"
       },
@@ -6158,7 +6195,10 @@ const navigationMenu = {
       active: true,
       orientation: "horizontal",
       class: {
-        link: "menu-item-horizontal-active border-(--menu-item-border)"
+        link: [
+          "leading-7 menu-item-horizontal-active border-(--menu-item-border)",
+          "bitrix-mobile:text-(--ui-color-base-2) bitrix-mobile:bg-transparent bitrix-mobile:border-(--ui-color-base-2)"
+        ].join(" ")
       }
     },
     {
@@ -6974,13 +7014,12 @@ const pinInput = () => ({
       "px-0 py-0",
       "border-0 focus:outline-none",
       "disabled:cursor-not-allowed",
-      "disabled:pointer-events-none",
+      "disabled:pointer-events-auto",
       "disabled:select-none",
       "disabled:opacity-30",
       "disabled:resize-none",
       "text-center",
-      "appearance-none transition duration-300 ease-linear",
-      // transition-colors
+      "appearance-none transition-colors duration-300 ease-linear",
       "text-(--ui-color-base-1)",
       "style-blurred-bg-input",
       "placeholder:text-(--ui-color-design-plain-na-content-secondary)",
@@ -7020,7 +7059,7 @@ const pinInput = () => ({
       "air-primary-alert": { base: "style-filled-alert" },
       "air-primary-copilot": { base: "style-filled-copilot" },
       "air-primary-warning": { base: "style-filled-warning" },
-      // @deprecate ////
+      // @deprecate This rule is deprecated and will be removed in version `3.0.0` ////
       "default": { base: "style-old-default" },
       "danger": { base: "style-old-danger" },
       "success": { base: "style-old-success" },
@@ -7154,11 +7193,13 @@ const popover = {
       "bg-(--ui-color-bg-content-primary)",
       "shadow-(--popup-window-box-shadow)",
       "rounded-(--ui-border-radius-xl) will-change-[opacity]",
+      // 'ring ring-(--ui-color-divider-default)',
       "motion-safe:data-[state=open]:animate-[scale-in_100ms_ease-out] motion-safe:data-[state=closed]:animate-[scale-out_100ms_ease-in]",
       "origin-(--reka-popover-content-transform-origin)",
       "focus:outline-none pointer-events-auto"
     ].join(" "),
     arrow: "fill-(--ui-color-bg-content-primary)"
+    // stroke-(--ui-color-divider-default)
   }
 };
 
@@ -7819,19 +7860,19 @@ const select = () => {
     {
       slots: {
         root: () => "isolate relative inline-flex items-center",
-        // @todo !!! ? w-full need
         base: () => [
           "relative inline-flex items-center group",
           "px-3",
           "w-full py-0 border-0 focus:outline-none",
           "cursor-pointer",
           "disabled:cursor-not-allowed",
-          "disabled:pointer-events-none",
+          "disabled:pointer-events-auto",
+          // fix ! 'disabled:pointer-events-none',
           "disabled:select-none",
           "disabled:opacity-30",
           "disabled:resize-none",
-          "appearance-none transition duration-300 ease-linear",
-          // transition-colors
+          "appearance-none transition-colors duration-300 ease-linear",
+          // fix ! transition
           "text-(--ui-color-base-1)",
           "style-blurred-bg-input",
           "hover:text-(--ui-color-base-1)",
@@ -7844,7 +7885,6 @@ const select = () => {
         value: "truncate pointer-events-none",
         placeholder: "truncate text-(--ui-color-design-plain-na-content-secondary)",
         content: [
-          // w-(--reka-combobox-trigger-width)
           "base-mode",
           "bg-(--ui-color-bg-content-primary)",
           "shadow-(--popup-window-box-shadow)",
@@ -7862,10 +7902,8 @@ const select = () => {
           "scroll-py-1",
           "w-[240px] max-h-[40vh]",
           "overflow-x-hidden overflow-y-auto scrollbar-thin"
-          // scrollbar-transparent
         ].join(" "),
         arrow: "fill-(--ui-color-bg-content-primary)",
-        // for content bottom|top::start -> ml-[12px]
         group: "grid",
         empty: [
           "h-(--popup-window-delimiter-section-height)",
@@ -7992,6 +8030,7 @@ const select = () => {
           "air-primary-alert": { item: "style-filled-alert" },
           "air-primary-copilot": { item: "style-filled-copilot" },
           "air-primary-warning": { item: "style-filled-warning" },
+          // @deprecate This rule is deprecated and will be removed in version `3.0.0` ////
           "default": { item: "style-old-default" },
           "danger": { item: "style-old-danger" },
           "success": { item: "style-old-success" },
@@ -8004,7 +8043,7 @@ const select = () => {
       },
       compoundVariants: (prev) => {
         return [
-          // from dropdown-menu
+          // @memo from dropdown-menu
           {
             colorItem: ["air-primary", "air-primary-success", "air-primary-alert", "air-primary-copilot", "air-primary-warning"],
             active: false,
@@ -8051,6 +8090,7 @@ const select = () => {
               ].join(" ")
             }
           },
+          // @deprecate This rule is deprecated and will be removed in version `3.0.0` ////
           {
             colorItem: ["danger", "success", "warning", "primary", "secondary", "collab", "ai"],
             active: true,
@@ -8087,12 +8127,10 @@ const selectMenu = () => {
         "scroll-py-1",
         "w-[240px] max-h-[40vh]",
         "overflow-x-hidden overflow-y-auto scrollbar-thin"
-        // scrollbar-transparent
       ].join(" "),
       content: (content) => [
         content,
-        "origin-(--reka-combobox-content-transform-origin) "
-        // w-(--reka-combobox-trigger-width)
+        "origin-(--reka-combobox-content-transform-origin)"
       ],
       trailingClear: "p-0"
     },
@@ -8103,13 +8141,11 @@ const selectMenu = () => {
         },
         false: {
           viewport: ""
-          // divide-y divide-(--ui-color-design-tinted-na-stroke)
         }
       },
       addNew: {
         true: {
           group: "",
-          // p-0 isolate -m-px
           item: [
             "text-(--b24ui-typography-legend-color)",
             "data-highlighted:not-data-disabled:text-(--b24ui-typography-label-color)",
@@ -8835,10 +8871,11 @@ const table$1 = {
     root: "relative overflow-auto",
     base: [
       "min-w-full",
-      "font-[family-name:var(--ui-font-family-primary)]"
+      "font-[family-name:var(--ui-font-family-primary)]",
+      "table-fixed border-separate border-spacing-0"
     ].join(" "),
     caption: "sr-only",
-    thead: "relative",
+    thead: "relative [&>tr]:[&>th]:h-[45px]",
     tbody: [
       "isolate",
       "[&>tr]:data-[selectable=true]:hover:bg-(--ui-color-bg-content-secondary)",
@@ -8846,7 +8883,8 @@ const table$1 = {
       "[&>tr]:data-[selectable=true]:focus-visible:outline-(--ui-color-accent-soft-element-blue)",
       "[&>tr]:data-[selected=true]:hover:bg-(--ui-color-bg-content-secondary)",
       "light:[&>tr]:data-[selected=true]:hover:bg-(#eff7d7)",
-      "[&>tr]:data-[selected=true]:focus-visible:outline-(--ui-color-accent-soft-element-blue)"
+      "[&>tr]:data-[selected=true]:focus-visible:outline-(--ui-color-accent-soft-element-blue)",
+      "[&>tr]:last:[&>td]:border-b-0"
     ].join(" "),
     tfoot: "relative",
     tr: [
@@ -8854,14 +8892,15 @@ const table$1 = {
       "light:data-[selected=true]:bg-[#f4fcde]"
     ].join(" "),
     th: [
-      "px-4 py-3.5",
+      "px-4 py-2",
       "text-(length:--ui-font-size-md)/(--ui-font-line-height-md)",
       "text-(--b24ui-typography-label-color)",
       "whitespace-nowrap",
       "text-left rtl:text-right",
       "font-(--ui-font-weight-normal)",
       "[&:has([role=checkbox])]:pe-0",
-      "align-middle"
+      "align-middle",
+      "border-b border-(--ui-color-divider-default)"
     ].join(" "),
     td: [
       "p-4",
@@ -8870,7 +8909,8 @@ const table$1 = {
       "whitespace-nowrap",
       "font-(--ui-font-weight-normal)",
       "[&:has([role=checkbox])]:pe-0",
-      "align-middle"
+      "align-middle",
+      "border-b border-(--ui-color-divider-default)"
     ].join(" "),
     separator: [
       "absolute z-1 left-0",
@@ -8888,11 +8928,11 @@ const table$1 = {
   variants: {
     virtualize: {
       true: {
-        tr: "relative before:absolute before:z-1 before:w-full before:border-b before:border-b-(--ui-color-design-tinted-na-stroke)"
+        tr: "relative before:absolute before:z-1 before:w-full before:border-b before:border-b-(--ui-color-divider-default)"
       },
       false: {
         base: "overflow-clip",
-        tbody: "divide-y divide-(--ui-color-design-tinted-na-stroke)"
+        tbody: "divide-y divide-(--ui-color-divider-default)"
       }
     },
     pinned: {
@@ -9248,17 +9288,15 @@ const tabs$1 = {
 const textarea = {
   slots: {
     root: "isolate relative inline-flex items-center",
-    // remove ? w-full
     base: [
       "px-3",
       "w-full pt-[7px] pb-[8px] border-0 focus:outline-none",
       "disabled:cursor-not-allowed",
-      "disabled:pointer-events-none",
+      "disabled:pointer-events-auto",
       "disabled:select-none",
       "disabled:opacity-30",
       "disabled:resize-none",
-      "appearance-none transition duration-300 ease-linear",
-      // transition-colors
+      "appearance-none transition-colors duration-300 ease-linear",
       "text-(--ui-color-base-1)",
       "style-blurred-bg-input",
       "placeholder:text-(--ui-color-design-plain-na-content-secondary)",
@@ -9301,7 +9339,7 @@ const textarea = {
       "air-primary-alert": { base: "style-filled-alert" },
       "air-primary-copilot": { base: "style-filled-copilot" },
       "air-primary-warning": { base: "style-filled-warning" },
-      // @deprecate ////
+      // @deprecate This rule is deprecated and will be removed in version `3.0.0` ////
       "default": { base: "style-old-default" },
       "danger": { base: "style-old-danger" },
       "success": { base: "style-old-success" },
@@ -9374,7 +9412,7 @@ const textarea = {
       class: {
         base: [
           "focus-visible:border-(--b24ui-border-color)",
-          "hover:border-(--b24ui-border-color)",
+          "hover:not-disabled:not-data-disabled:border-(--b24ui-border-color)",
           "data-[state=open]:border-(--b24ui-border-color)"
         ].join(" ")
       }
@@ -9407,6 +9445,11 @@ const textarea = {
       noPadding: false,
       class: "ps-[34px]"
     },
+    {
+      leading: true,
+      loading: true,
+      class: "ps-[34px]"
+    },
     // endregion ////
     // region trailing ////
     {
@@ -9761,24 +9804,23 @@ const toaster = {
 const tooltip = {
   slots: {
     content: [
-      "dark",
+      "light",
       "flex flex-row items-center justify-between gap-[5px] will-change-[opacity]",
       "min-h-[37px]",
       "shadow-xl/20",
       "select-none",
       "motion-safe:data-[state=delayed-open]:animate-[scale-in_100ms_ease-out] motion-safe:data-[state=closed]:animate-[scale-out_100ms_ease-in]",
-      "p-[10px]",
-      "text-(length:--ui-font-size-sm)/(--ui-font-line-height-reset) font-[family-name:var(--ui-font-family-primary)]",
-      "bg-(--ui-color-bg-content-primary)/80",
-      "text-(--ui-color-design-plain-na-focused-content)",
-      "rounded-[calc(var(--ui-border-radius-xl)-2px)]",
-      // @memo see components/popup.css
-      // 'border border-(--popup-window-border)'
+      "p-[13px] ps-[26px]",
+      "text-(length:--ui-font-size-lg)/[normal] font-[family-name:var(--ui-font-family-system)]",
+      "bg-(--ui-color-bg-content-inapp)",
+      "text-(--ui-color-base-8)",
+      "rounded-[calc(var(--ui-border-radius-3xl)-2px)]",
+      "ring ring-(--ui-color-bg-content-inapp)",
       "origin-(--reka-tooltip-content-transform-origin)",
       "pointer-events-auto"
     ].join(" "),
-    arrow: "fill-(--ui-color-bg-content-primary)/80",
-    text: "text-pretty max-w-[200px] min-w-[100px]",
+    arrow: "fill-(--ui-color-bg-content-inapp) stroke-(--ui-color-bg-content-inapp)",
+    text: "text-pretty max-w-[344px] min-w-[100px]",
     // truncate
     kbds: `hidden lg:inline-flex items-center shrink-0 gap-0.5 not-first-of-type:before:content-[''] not-first-of-type:before:me-0.5`,
     kbdsSize: "sm",
@@ -9797,6 +9839,7 @@ const sidebarLayout = {
     ].join(" "),
     sidebar: [
       // @memo use src/runtime/air-design-tokens/components/navigation-menu.css
+      // @deprecate This rule (air-sidebar) is deprecated and will be removed in version `3.0.0` ////
       "air-sidebar",
       "before:absolute before:inset-0 before:z-[-1]",
       "before:bg-(--leftmenu-bg-expanded)",
@@ -9825,6 +9868,7 @@ const sidebarLayout = {
     ].join(" "),
     header: [
       // @memo use src/runtime/air-design-tokens/components/navigation-menu.css
+      // @deprecate This rule (air-header) is deprecated and will be removed in version `3.0.0` ////
       "air-header",
       "px-(--content-area-shift) min-h-(--topbar-height)",
       "flex items-center gap-x-1"
@@ -11087,7 +11131,7 @@ const field = {
 };
 
 const fieldGroup = {
-  base: "my-[20px] divide-y divide-(--ui-color-design-tinted-na-stroke) *:not-last:pb-[20px]"
+  base: "my-[20px] divide-y divide-(--ui-color-divider-default) *:not-last:pb-[20px]"
 };
 
 const ol = {
@@ -11462,6 +11506,7 @@ const contentToc = {
       "lg:hidden"
     ].join(" "),
     content: [
+      "relative",
       "motion-safe:data-[state=open]:animate-[collapsible-down_200ms_ease-out]",
       "motion-safe:data-[state=closed]:animate-[collapsible-up_200ms_ease-out]",
       "overflow-hidden",
@@ -11654,9 +11699,10 @@ function getTemplates(options, uiConfig, nuxt, resolve) {
   body {
     scrollbar-gutter: stable;
     background: var(--air-theme-background);
-    @apply ${prefix}antialiased ${prefix}font-(family-name:--ui-font-family-system) ${prefix}text-(--b24ui-typography-legend-color) ${prefix}scheme-light ${prefix}dark:scheme-dark ${prefix}edge-light:scheme-light ${prefix}edge-dark:scheme-light;
+    @apply ${prefix}antialiased ${prefix}font-(family-name:--ui-font-family-system) ${prefix}scheme-light ${prefix}dark:scheme-dark ${prefix}edge-light:scheme-light ${prefix}edge-dark:scheme-light;
   }
 
+  /* @deprecate This rule is deprecated and will be removed in version 3.0.0 */
   .sidebar-layout.--inner {
     background: var(--air-theme-background);
   }